我尝试将一些基本样式应用于MUI v5中的自动完成组件中的选项。我只是尝试更改悬停时的背景颜色，并基于是否选中它。我尝试了基于文档的两种方法，使用主题，并将sx属性应用于自动完成。
使用主题几乎让我有，代码如下：

import { createTheme, ThemeProvider } from '@mui/material/styles';

const theme = createTheme({
  components: {
    MuiAutocomplete: {
      styleOverrides: {
        option: {
          '&[aria-selected="true"]': {
            backgroundColor: '#e3abed',
          },

          '&:hover': {
            backgroundColor: '#9c27b0',
          },
          backgroundColor: '#fff',
        },
      },
    },
  },
})

我将ThemeProvider Package 在整个应用程序中
和组分：

<Autocomplete
  options={['1', '2', '3']}
  renderInput={(params) => <TextField {...params} label="Priority" />}
  onChange={(_e, val) => setPriority(val)}
/>

所以，这几乎是可行的。然而，[aria-selected=“true”]样式只有在我将鼠标悬停在下拉菜单中的另一个选项上时才被应用。否则，组件将默认为灰色，我不明白为什么。
我尝试过的第二种方法是在Autocomplete组件上使用sx prop，在文档中它说你可以通过类名来定位子组件：https://mui.com/material-ui/customization/how-to-customize/#overriding-styles-with-class-names
以下是我的组件：

<Autocomplete
  options={['1', '2', '3']}
  renderInput={(params) => <TextField {...params} label="Priority" />}
  onChange={(_e, val) => setPriority(val)}
  sx={{
    '& .MuiAutocomplete-option': {
      backgroundColor: '#000',
    },
    '& .Mui-focused': {
      backgroundColor: 'red',
    },
  }}
  open
/>

这似乎没有任何效果。我已经在这上面工作了将近2个小时，似乎还不能到达终点线。任何帮助都将不胜感激。