Javascript 分隔器颜色变化反应材质界面

我正在使用MaterialUI框架的分割器组件，并且一直在处理颜色变化方面的问题。使用此框架中的大多数其他组件，我可以通过应用useStyles（）方法来更改颜色，如下所示：

const useStyles = makeStyles(theme => ({
    textPadding: {
      paddingTop: 10,
      paddingBottom: 10,
      color:'white',
    },
}));

但我无法使用相同的方法更改分隔符的颜色：

const useStyles = makeStyles(theme => ({
dividerColor: {
  backgroundColor: 'white',
},
}));

我当然会将其应用于组件：

<Divider classname={classes.dividerColor}></Divider>

---

我查了一下文件，但不知道我做错了什么。有人能帮我一下吗

在使用

材质ui

样式时，应始终使用

className

，而不是像

className

这样的典型javascript样式声明

---

您还可以参考官方文档：

您必须使用类覆盖CSS

<Divider classes={{root: classes.dividerColor}} />

---

请参阅CSS覆盖上的材质UI文档：

使用

类

API更改

分隔符

颜色：

const useStyles = makeStyles((theme) => ({
  divider: {
      // Theme Color, or use css color in quote
      background: theme.palette.divider,
  },
}));


<Divider classes={{root: classes.divider}} />

const useStyles=makeStyles（（主题）=>({
分隔器：{
//主题颜色，或在引用中使用css颜色
背景：theme.palete.divider，
},
}));

，您可以使用

---

类名示例：

const useStyles = makeStyles((theme) => ({
  divider: {
      background: "white",
  },
}));


<Divider className={classes.divider} />

const useStyles=makeStyles（（主题）=>({
分隔器：{
背景：“白色”，
},
}));

我认为唯一的问题是您需要

className

而不是

className

（大写N）。事实上，控制台中应该有一个警告。