我们如何从 Material UI 更改“标记”的文本颜色？

Question

我可以更改 FormControl、Slider 等的所有颜色。但是我找不到更改的方法是 Slider 的“标记”的标签颜色或文本颜色。如果有人可以提供帮助，将不胜感激。

Answer 1

为?等标记创建样式

const useStyles = makeStyles(theme => ({
  ....
  mark: {
    color: "red"
  }
}));

然后使用组件的classes 属性覆盖markLabel 全局类，如?

<Slider
        defaultValue={80}
        getAriaValueText={valuetext}
        aria-labelledby="discrete-slider-always"
        step={10}
        marks={marks}
        valueLabelDisplay="on"
        classes={{ markLabel: classes.mark }}
      />

要进行更多自定义，您可以使用 classes 属性覆盖此文档 https://material-ui.com/api/slider/ 中提到的所有 CSS 类

演示：https://stackblitz.com/edit/nmzqd5?file=demo.js