材质ui输入背景颜色覆盖标准标签

Question

我使用react material ui，我想更改输入（标准）的背景颜色，问题是当未选择输入时标签会被背景颜色覆盖。

Input selected

Input not selected

这就是我尝试过的

  overrides: {
    MuiInput: {
      root: {
        backgroundColor: '#FF0000'
      }
    },
   }

我的输入

  <TextField />

我发现使其起作用的唯一方法是为颜色添加透明度，还有其他方法吗？我只想更改后台输入，而不是所有组件

Answer 1

如果您正在使用<TextField/>组件，则可以尝试覆盖<TextField/>根样式。

您可以查看示例-> Codesandbox

const theme = createMuiTheme({
  overrides: {
    MuiTextField: {
      root: {
        backgroundColor: "#FF0000"
      }
    }
  }
});