Question

我正在使用材料-ui反应，我想覆盖主题以符合我自己的需要，我看到你可以改变每个组件的所有属性，但我试图改变appbar的样式但没有任何事情发生。

以下是我的尝试：

let theme = {
    appBar: {
        style:{
            height: 128
        }
    }
}

我知道我可以改变appbar的高度但是我想要改变一些不属于属性的东西，比如抽屉式的'top'，如下所示：

let theme= {
    drawer:{
        style:{
            top: 64
        }
    }
}

那我怎么能这样做呢？

Answer 1

尝试在没有样式道具的情况下设置值。

所以而不是：

let theme = {
    appBar: {
        style:{
            height: 128
        }
    }
}

更改为：

let theme = {
    appBar: {            
        height: 128
    }
}

//Example
const muiTheme = getMuiTheme(theme);
...

Answer 2

您只能在theme对象中设置有限范围的属性。您可以通过此online tool发现所有支持的属性以及它们如何更改外观。如果您在theme中没有所需内容，则可以通过style属性手动设置。

请注意，通常在Material-UI组件中有一些“样式”属性。例如style的{{1}}，titleStyle，iconStyleLeft，iconStyleRight。

Answer 3

Pachu。回答你的问题：“如何改变Material-ui的主题？”。你可以尝试一下：

const muiTheme = getMuiTheme({
   palette: {
     textColor: cyan500,
   },
   appBar: {
     height: 50,
   },
});