相关疑难解决方法(0)

我正在尝试将这个答案中的一些CSS-in-JS类与React项目中的重要UI组件一起使用。我需要覆盖来自Bootstrap的CSS，所以我想使用！important修饰符，我以前仅在.css文件中使用过它，并且不确定如何在CSS-in-JS中使用它。我的要传递给Material-UI withStyles函数的样式对象如下所示，如何在fontSize属性中添加！important？我已经尝试30 !important了一些其他方法，但是似乎没有任何效果。

谢谢

const styles = {
  labelRoot: {
    fontSize: 30
  }
}

当涉及到着色元素时，我在 Material-UI 中的主题方面遇到了一些困难。某些元素会自动选择“theme.palette.main.dark”。我想知道如何强迫他们不要这样做。

例如 TextField 和 SpeedDial 组件会自动从主题中选择 dark 属性。我试图只删除 dark 属性，但 TextField 是黑色的，并且 TextField 内的文本不可读。

我的主题文件配置如下：

import {createMuiTheme} from "@material-ui/core";
import {green, indigo, red} from "@material-ui/core/colors";

const theme = createMuiTheme({
  palette: {
    primary: {
      main: indigo.A200,
      dark: green.A100
    },
    white: {
      text: '#fff',
    },
    secondary: {
      main: red.A100,
      dark: green.A100,
    }
  }
});

export default theme;

我希望 TextField 和 SpeedDial 选择原色，但实际结果是他们选择了 dark 属性，可能是因为否则会干扰人们无法正确看到组件，但我想自定义选择颜色。我一直无法找到有关如何更改 TextField 组件中下划线和浮动的颜色的解释。

https://codesandbox.io/s/material-demo-o52c8