Question

我正在尝试在我的项目中设置一个简单的主题覆盖设置，但它似乎没有应用。

主题:(所有这一切都应该将原色改为红色，但不是）

const theme = createMuiTheme({
    palette: {
        type: 'dark',
        primary: {
            light: red[300],
            main: red[500],
            dark: red[700],
        },
    },
    appBar: {
        height: 55,
    },
});
const styles = theme => ({})

然后我将整个应用程序包装在MuiThemeProvider中，就像这样

class App extends Component {

    constructor(props) {
        super(props);
    }

    render() {
        return (
            <CssBaseline />,
            <Router>
                <MuiThemeProvider muiTheme={theme}>
                    <div>
                        <MaterialUiApp />
                    </div>
                </MuiThemeProvider>
            </Router>
        );
    }
} export default withStyles(styles, { withTheme: true })(App);

然而，似乎并没有将主题应用于我的应用中的元素。 MaterialUiApp只是我主要布局的各个部分的包装器，例如两个永久抽屉，appbar和一个内容容器（当前其中包含表单元素）。

编辑：我可以通过将我的AppBar颜色从主要颜色切换到次要颜色来判断默认主题是否正确应用，但是它使用默认主题的颜色而不是我自己的颜色。

修改：Here's the code on CodeSandbox。

Answer 1

显然我的问题是在MuiTheme元素中使用muiTheme={theme}。在材料-ui beta中它应该只是theme={theme}。我没有意识到他们改变了它。

Material-ui Next主题不适用

1 个答案: