我正在尝试应用自定义css到材料UI自动完成组件。具体地说，我想改变输入字段的字体大小。我现在有的是：
<Autocomplete
style={{
width: 200,
height: 60,
marginLeft: 15,
}}
options={["foo", "bar"]}
renderInput={(params) => (
<TextField
InputProps={{ style: { fontSize: 30 } }}
{...params}
margin="normal"
/>
)}
/>
我相信我的TextField的样式是正确的，但是它的CSS被自动完成CSS覆盖了。感谢任何帮助。提前道谢。
你可以尝试其中的两种,
InputProps={{ style: { fontSize: 30 } }}
{...params}
成为
{...params}
InputProps={{ style: { fontSize: 30 } }}
这是因为第二个{...params}重写了inputprops。
InputProps={{ style: { fontSize: `30 !important` } }}
万一有人还在搜索答案，这就是如何根据Autocomplete API将CSS属性正确应用到输入元素。通过这种方法，您可以利用为autocomplete组件的底层元素提供类的可能性。
<Autocomplete
size={"small"}
id="box" options={myOptions}
getOptionLabel={(option: string) => option}
renderInput={(params) => <TextField {...params} variant="outlined" /> }
classes={{ input: classes.smallFont }} />
例如，您可以为“inputroot”指定一个类，而不是“input”，以便在input根元素处设置一个类（这取决于您想要实现的目标）
