☰

警告: 非ブール属性に対して `false` を受け取りました。カスタム ブール属性にブール値を渡すにはどうすればよいでしょうか? 質問する

tag-icon • tag-icon reactjs styled-components react-16
警告: 非ブール属性に対して `false` を受け取りました。カスタム ブール属性にブール値を渡すにはどうすればよいでしょうか? 質問する 
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()}.

React のカスタム属性にブール値を渡すにはどうすればいいですか?

私は styled-components を使用して、コンポーネントを通じて属性を渡しています。以下は、属性を渡す方法を示した図です。

ブール値のカスタム属性を「comingsoon」として渡す

スタイル付きコンポーネント CSS プロパティ

ベストアンサー1

から5.1ご利用いただけます一時的な小道具( $) は、props が DOM 要素に渡されるのを防ぎます。

const Comp = styled.div`
  color: ${props =>
    props.$draggable || 'black'};
`;

render(
  <Comp $draggable="red" draggable="true">
    Drag me!
  </Comp>
);

おすすめ記事