Warning: Received `false` for a non-boolean attribute. How do I pass a boolean for a custom boolean attribute?

Question

Warning: Received `false` for a non-boolean attribute `comingsoon`.

If you want to write it to the DOM, pass a string instead: 
comingsoon="false" or comingsoon={value.toString()}.

How do I pass a boolean in a custom attribute for React?

I'm using styled-components and passing the attribute through the component. Here is a picture of how I'm passing the attr.

passing boolean custom attr as "comingsoon"

styled-components css props

Answer 1

Try this instead:

comingsoon={value ? 1 : 0}