如何更改禁用的TextField Material UI React js的字体颜色

Question

我正在尝试更改禁用的TextField字体颜色，我在stackoverflow中关注了有关它的相关问题，但当我创建一个新的TextField时，它不起作用，也什么都不显示。

import {withStyles} from '@material-ui/core/styles';
import TextField from "@material-ui/core/TextField";

const myTextField = withStyles({
root: {
"& .MuiInputBase-root.Mui-disabled": {
color: "rgba(0, 0, 0,0.0)"
}
}
})(TextField);


<myTextField
value={user  != null ? user.nam : null}
disabled={true}
variant="outlined"
margin="normal"
fullWidth
id="nam"
autoFocus
label="nam"
/>

<TextField
value={user  != null ? user.famil : null}
disabled={true}
variant="outlined"
margin="normal"
fullWidth
id="famil"
autoFocus
label="famil"
/>

它显示了TextField"；家族；但不显示myTextField"；nam"；

Answer 1

我的muistake是我使用React Component的lowerCase名称。我更新"；myTextField"；至"；MyTextField"；它是有效的。

另一个你必须使用的东西。MuiFormLabel-root.Mui-disabled类以更改字体颜色。.MuiInputBase-root.Mui-disabled类只是更改TextField的标签字体颜色。

const MyTextField = withStyles({
root: {
"& .MuiInputBase-root.Mui-disabled": {
color: "rgba(0, 0, 0,0.0)"
},
"& .MuiFormLabel-root.Mui-disabled": {
color: "rgba(0, 0, 0,0.0)"
},
}
})(TextField);