有没有办法创建ColoredCheckbox组件?

时间:2019-10-15 14:48:26

标签: reactjs material-ui

我正在尝试创建一个可重复使用的材质-ui彩色复选框, 您将十六进制颜色传递给组件,它会影响复选框的颜色。

到目前为止,我已经知道了,但是我想不出一种将颜色传递给withStyles的方法...

const WhiteCheckbox = withStyles({
  root: {
    color: '#fff',
    '&$checked': {
      color: '#fff',
    },
  },
  checked: {},
})(props => <Checkbox color="default" {...props} />);

如果有任何提示使其工作,请先感谢。

1 个答案:

答案 0 :(得分:0)

您可以使用function for the value在样式中利用道具。

以下是如何实现此功能的有效示例:

hypot

Edit Colored Checkbox

这默认将颜色设置为sqrt(x*x + y*y),因为它是default Checkbox behavior