如何更改材质的背景颜色-ui/lab/Autocomplete

import React from 'react';
import { Autocomplete } from '@mui/material';

function App() {
  return (
    <Autocomplete
      style={{ backgroundColor: 'lightblue' }}
      options={['Option 1', 'Option 2', 'Option 3']}
      renderInput={(params) => <input {...params} />}
    />
  );
}

export default App;

import React from 'react';
import { Autocomplete } from '@mui/material';
import './App.css';

function App() {
  return (
    <Autocomplete
      className="custom-autocomplete"
      options={['Option 1', 'Option 2', 'Option 3']}
      renderInput={(params) => <input {...params} />}
    />
  );
}

export default App;

.custom-autocomplete-root {
  background-color: lightblue;
}

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

const theme = createTheme({
  components: {
    MuiAutocomplete: {
      styleOverrides: {
        root: {
          backgroundColor: 'lightblue',
        },
      },
    },
  },
});

function App() {
  return (
    <ThemeProvider theme={theme}>
      <Autocomplete
        options={['Option 1', 'Option 2', 'Option 3']}
        renderInput={(params) => <input {...params} />}
      />
    </ThemeProvider>
  );
}

export default App;