无法在material-ui中使用暗模式切换

import React from 'react';
import { createMuiTheme, ThemeProvider } from '@material-ui/core/styles';

// 创建主题对象
const darkTheme = createMuiTheme({
  palette: {
    type: 'dark',
  },
});

const lightTheme = createMuiTheme({
  palette: {
    type: 'light',
  },
});

function App() {
  const [darkMode, setDarkMode] = React.useState(false);

  // 切换主题
  const toggleTheme = () => {
    setDarkMode(!darkMode);
  };

  return (
    <ThemeProvider theme={darkMode ? darkTheme : lightTheme}>
      {/* 应用程序的其他组件 */}
      <button onClick={toggleTheme}>切换主题</button>
    </ThemeProvider>
  );
}

export default App;