小编Moh*_*leb的帖子

Material UI:在 React 类组件中使用主题

我正在寻找像 ThemeConsumer 这样的东西(可能不存在)。我有 React 组件,我正在使用withStyles()高阶组件来注入自定义样式。它在文档中得到了很好的描述,但我没有找到任何使用主题的示例。


我有一些包含ThemeProvider 的基本组件。这意味着任何 MUI 组件都受到它的影响。

const prefersDarkMode = useMediaQuery('(prefers-color-scheme: dark)');
const theme = getTheme(prefersDarkMode);
return (
   <ThemeProvider theme={theme}>
      ...
   </ThemeProvider>
)
Run Code Online (Sandbox Code Playgroud)

我还使用一些功能组件makeStyles()来创建具有提供主题的样式。

const useStyles = makeStyles(theme => ({
   // here I can use theme provided by ThemeProvider
});
Run Code Online (Sandbox Code Playgroud)

但是不能在类组件中使用。所以我正在使用withStyles()HOC。

const styles = {
   // I would like to use here provided theme too
}
export default withStyles(styles)(SomeComponent);
Run Code Online (Sandbox Code Playgroud)

我的问题摘要:
如何在类组件中使用提供的主题

reactjs material-ui

7
推荐指数
2
解决办法
5949
查看次数

标签 统计

material-ui ×1

reactjs ×1