如何将 React prop 传递给 CSS

Question

我有一个问题 - 我不知道如何使用 props 中的颜色值更改复选框颜色。我的想法是通过 style 属性给它，但我不知道如何切换它。我正在使用rc-switch，我想根据 Switch 状态更改他的背景。我现在有这样的事情

<Switch style={{ backgroundColor: mainColor }}/>

但它为两个状态设置了这种颜色，我希望这个开关在处于关闭位置时变为“defaultColor”。

Answer 1

Switch 组件上没有 style 属性，但有一个 className 属性，您可以使用它来添加自定义类。

如果您使用 sass：

.mySwitch {
  &-black {
    background-color: black;
  }

  &-yellow {
    background-color: yellow;
  }
}

然后以编程方式切换课程。

<Switch className={`mySwitch-${color}` ... />

可能是一种选择，我想。