[英]How to pass inputProps for material-ui TextField Input into styled-components element?
我现在有 material-ui TextField 元素和 styles :
import TextField from "@mui/material/TextField";
const inputStyle = {
fontSize: 24,
pl: 2,
pt: 0.5,
pb: 0.5,
};
<TextField
variant="outlined"
inputProps={{
sx: inputStyle,
}}
/>
现在我想用样式组件制作一个组件:
import { styled } from "@mui/material/styles";
import TextField from "@mui/material/TextField";
export const CustomizedTextField = styled(TextField)`
font-size: 24px;
padding-left: 16px;
padding-top: 8px;
padding-bottom: 8px;
`;
<CustomizedTextField
variant="outlined"
/>
但它不起作用。 我确定我没有正确传递 TextField 的 inputProps,但我不知道如何正确地做到这一点。
如果您或其他任何人仍然遇到这种情况:我正在做类似的事情,但只是使用“样式”输入道具。 我也成功地使用了“className”道具。
就您而言,我相信您可以执行以下操作:
<TextField
variant="outlined"
InputProps={{
style: inputStyle,
}}
/>
也不确定它是否重要,但 inputProps/InputProps 的大写/非大写版本之间似乎存在一些差异。 如果有区别,我总是使用大写的版本。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.