Question

我想更改特定的材质组件样式，例如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的颜色，但无效。

我错过了什么？

Answer 1

如文档here中所述：

如果使用所记录的主题的overrides键，则需要使用以下样式表名称：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

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

1 个答案: