我想更改禁用的 MUI TextField 的字體顏色。它應該是黑色的,以便可見。
這是代碼
<TextField
fullWidth
variant="standard"
size="small"
id="id"
name="name"
type="text"
InputProps={{disableUnderline: true}}
disabled={true}
/>
我洗掉了標準文本欄位的下劃線。現在我想要在禁用時文本顏色為黑色。
uj5u.com熱心網友回復:
您需要使用“.Mui-disabled”類來覆寫所需的css,如下所示,
import TextField from "@mui/material/TextField";
import { styled } from "@mui/material/styles";
const CustomDisableInput = styled(TextField)(() => ({
".MuiInputBase-input.Mui-disabled": {
WebkitTextFillColor: "#000",
color: "#000"
}
}));
function App() {
return (
<>
<span>Disabled Input:</span>
<CustomDisableInput
fullWidth
variant="standard"
size="small"
id="id"
name="name"
type="text"
value="your text"
InputProps={{ disableUnderline: true }}
disabled={true}
/>
</>
);
}
請在此處查看演示 - https://codesandbox.io/s/mui-customdisableinput-xl7wv
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/381498.html
標籤:javascript 打字稿 材质-ui
