reactjs - 警告 : Received `false` for a non-boolean attribute. 如何为自定义 bool 属性传递 bool 值？

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()}.

如何在 React 的自定义属性中传递 bool 值？

我正在使用样式组件并通过组件传递属性。这是我如何传递 attr 的图片。

passing boolean custom attr as "comingsoon"

styled-components css props

Answer 1

从 5.1 开始，您现在可以使用 transient props ($) 阻止将 props 传递给 DOM 元素。

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

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