如何实现React Material UI的全局主题？

提问于 2024-05-11T13:16:00+08:00

浏览次

0

我想更改特定的Material组件样式，例如 ListItemText ，在我的情况下，我更喜欢使用 theme 变量，而不是一次性解决方案，在app中处理每个材质组件 .

const theme = createMuiTheme({
    overrides: {
        ListItemText: {
            root: {
                color: 'red'
            }
        }
    }
});



render(
    <MuiThemeProvider theme={theme}>
        <Router history={history}>
            <Root store={store} />
        </Router>
    </MuiThemeProvider>
   ,
    document.getElementById('root')
)

我试图在官方文档（https://material-ui-next.com/customization/themes/#customizing-all-instances-of-a-component-type）之后覆盖 ListItemText 的颜色，但不起作用 .

我错过了什么？

1 回答

1
如文档_1800483中所述：

如果使用了所记录的主题的覆盖键，则需要使用以下样式表名称：MuiListItemText

所以你的代码应该是
```
const theme = createMuiTheme({
    overrides: {
        MuiListItemText: {
            root: {
                color: 'red'
            }
        }
    }
});
```
源代码：https://github.com/mui-org/material-ui/blob/303199d39b42a321d28347d8440d69166f872f27/packages/material-ui/src/ListItem/ListItem.js#L208
回复于 2024-05-11T13:16:00+08:00

相关问题