MUI - 自动完成颜色样式损坏答案

【问题标题】：MUI - Autocomplete color styles brokenMUI - 自动完成颜色样式损坏
【发布时间】：2021-10-28 18:07:26
【问题描述】：

由于某些未知原因，自动完成列表的字体颜色为白色，我在正文中添加的唯一 css 属性是 background-color: "#fafbff"，但我已经测试过，这不是问题的原因

export default function FreeSolo() {
  return (
    <Stack spacing={2} sx={{ width: 300 }}>
      <Autocomplete
        id="free-solo-demo"
        freeSolo
        options={top100Films.map((option) => option.title)}
        renderInput={(params) => <TextField {...params} label="freeSolo" />}
      />
      <Autocomplete
        freeSolo
        id="free-solo-2-demo"
        disableClearable
        options={top100Films.map((option) => option.title)}
        renderInput={(params) => (
          <TextField
            {...params}
            label="Search input"
            InputProps={{
              ...params.InputProps,
              type: "search",
            }}
          />
        )}
      />
    </Stack>
  );
}

我也在使用下面样式li { font-color: white }的组件

【问题讨论】：

您的代码没有问题。您必须在其他地方将颜色设置为白色。
感谢您的帮助，您帮助找到了问题，我有一个全局 li 样式设置为白色的组件
所以...似乎自动完成列表被包裹在 li 标签中
欢迎回答

标签： reactjs material-ui

【解决方案1】：

我将您的代码放在codesandbox 中，没有任何问题。您可能从其他地方将颜色设置为white，所以请检查一下。您可以通过将代码 sn-p 放入新项目的问题中来确认您的代码是否正常工作。

【讨论】：