Question

我有一个组件，我想通过 style 属性将我的自定义样式传递给它
但是我在每个部分之间遇到了（ , ）的语法错误组件

  <NeuButton
          width='60%'
          height='40px'
          style={{}}

我想添加到样式中的是

"box-shadow": 0px 0px 0px #b6c0ca, 0px 0px 0px #ffffff, inset 5px 6px 4px #b6c0ca, inset 0px 0px 6px #ffffff,

用于各边组件的阴影

Answer 1

只需将值用引号括起来，并使用 boxShadow 而不是“box-shadow”（使用 javascript 命名约定）

boxShadow: `0px 0px 0px #b6c0ca, 0px 0px 0px #ffffff, inset 5px 6px 4px #b6c0ca, inset 0px 0px 6px #ffffff`

为什么你需要这样做？这里有一个例子

let height = 0;
//...
style={{width: 0, height}}

这里如何判断是 width: 0, 1 还是 width: 0 和 height:0？你不能，这就是为什么有很多属性的 css 属性应该用引号括起来。

Answer 2

你必须使用jss风格

<NeuButton 
     style={{ boxShadow: " 0px 0px 0px #b6c0ca, 0px 0px 0px #ffffff, inset 5px 6px 4px #b6c0ca, inset 0px 0px 6px #ffffff" }}
>
  Content here

</NeuButton>

将样式传递给样式道具的问题

2 个答案: