按钮禁用了背景颜色内联样式属性jsx

时间:2018-09-26 20:27:28

标签: css jsx

我有一种情况,我只能将属性传递给jsx组件,但不能使用标准的CSS类(组件不可达,只能通过将属性传递给其父组件来设置样式)。有没有一种方法可以使用内联样式属性为禁用的按钮设置背景颜色?

编辑 我得到的最接近的是style: {[disabled=true]:{backgroundColor: "red"}},但我得到了Uncaught ReferenceError:未定义

2 个答案:

答案 0 :(得分:0)

是的。这样的事情应该起作用:

定义样式:

const disabled = {
  backgroundColor: "red"
};

然后在按钮组件出现的任何地方:

<Button style={disabled}>
  Example Button
</Button>

祝你好运!

答案 1 :(得分:0)

请问您是否将禁用作为道具传递到组件中?

如果是这样你可以在下面做

const isDisabled = {
   backgrondColor: 'red'
};

<button style={disabled ? isDisabled : null}>
   Button 1
</button>