如何更改禁用的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 “famil”，但不顯示 myTextField “nam”

Answer 1

我的錯誤是我為 React 組件使用小寫名稱。 我將“myTextField”更新為“MyTextField”並且它可以工作。

您必須使用的另一件事。MuiFormLabel-root.Mui-disabled class 更改字體顏色。 .MuiInputBase-root.Mui-disabled class 只是改變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);