css - 如何使用主题更改 Material UI Select 或 Menu MenuItem 悬停样式

Question

我创建了自己的主题 从 'material-ui/styles' 导入 { createMuiTheme };

export const MyTheme = createMuiTheme({
    palette: {
        primary: {
            light: '#757ce8',
            main: '#3f50b5',
            dark: '#002884',
            contrastText: '#fff',
        },
        secondary: {
            light: '#ff7961',
            main: '#f44336',
            dark: '#ba000d',
            contrastText: '#000',
        },
        error: {
            light: '#FF5F57',
            main: '#CE160C',
            dark: '#380300',
            //contrastText: will be calculated to contast with palette.primary.main
        }
    }
});

在我的应用中使用它

<MuiThemeProvider theme={MyTheme}>
    <AppContainer>
        <BrowserRouter children={ routes } basename={ baseUrl } />
    </AppContainer>
</MuiThemeProvider>

但是如何使用主题更改 Menu 和 Select 中的 MenuItem 悬停样式？

Answer 1

使用主题实现悬停和选定元素样式

export const MyTheme = createMuiTheme({
    palette: {
        action: {
            selected: '#E7A615',
            hover: '#FFD371',
            disabled: '#9B9B9B'
        }
    }
});