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"
                                        />

It shows the TextField "famil" but doesn't show myTextField "nam"

Answer 1

我的错觉是我在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);

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

1 个答案: