Reactjs 如何在材质界面中分别设置凸起按钮、扁平按钮的主题

我正在尝试使用react在材质ui中创建自定义主题

palette: {
primary1Color: pink500,
primary2Color: pink500,
primary3Color: grey300,
accent1Color: grey500,
accent2Color: grey500,
accent3Color: grey300,
textColor: darkBlack,
alternateTextColor: white,
canvasColor: white,
borderColor: grey300,
disabledColor: fade(grey700, point3),
pickerHeaderColor: cyan500,
clockCircleColor: fade(darkBlack, point7),
shadowColor: fullBlack

}

托盘是这样的。扁平按钮工作正常，但凸起的按钮以accent1Color:grey500为背景。我不想同时我也不想用“labelStyle”和“backgroundColor”这样的道具来覆盖。有没有其他方法专门创建一个主题选项，我只需要添加secondary={true}，它的backgroundColor为灰色50，labelStyle为灰色900

---

任何帮助都将不胜感激。希望得到一些帮助。

您可以创建类似的内容。可以使用此方法替代每个组件使用的颜色。请注意，我在所有地方都使用了

primary1Color

作为示例

const palette = {
  primary1Color: '#ffc20e',
  primary2Color: '#e30413'
}

const theme = {
  palette: palette,
  raisedButton: {
    color: palette.primary1Color,
    textColor: palette.primary1Color,
    primaryColor: palette.primary1Color,
    primaryTextColor: palette.primary1Color,
    secondaryColor: palette.primary1Color,
    secondaryTextColor: palette.primary1Color,
    disabledColor: palette.primary1Color,
    disabledTextColor: palette.primary1Color,
  }
}

<MuiThemeProvider muiTheme={getMuiTheme(theme)}>
    <div className='appContainer'>
       {children}
    </div>
</MuiThemeProvider>

const调色板={
原色1:“#ffc20e”，
主要颜色：“#e30413”
}
常量主题={
调色板：调色板，
升起按钮：{
颜色：调色板。原色1颜色，
textColor:palette.Primary1颜色，
primaryColor:palette.primary1Color，
primaryTextColor:palette.primary1Color，
第二种颜色：调色板。第一种颜色，
secondaryTextColor:palette.primary1Color，
禁用颜色：palette.Primary1颜色，
禁用的TextColor:palette.Primary1颜色，
}
}
{儿童}

您可以创建类似的内容。可以使用此方法替代每个组件使用的颜色。请注意，我在所有地方都使用了

primary1Color

作为示例

const palette = {
  primary1Color: '#ffc20e',
  primary2Color: '#e30413'
}

const theme = {
  palette: palette,
  raisedButton: {
    color: palette.primary1Color,
    textColor: palette.primary1Color,
    primaryColor: palette.primary1Color,
    primaryTextColor: palette.primary1Color,
    secondaryColor: palette.primary1Color,
    secondaryTextColor: palette.primary1Color,
    disabledColor: palette.primary1Color,
    disabledTextColor: palette.primary1Color,
  }
}

<MuiThemeProvider muiTheme={getMuiTheme(theme)}>
    <div className='appContainer'>
       {children}
    </div>
</MuiThemeProvider>

const调色板={
原色1:“#ffc20e”，
主要颜色：“#e30413”
}
常量主题={
调色板：调色板，
升起按钮：{
颜色：调色板。原色1颜色，
textColor:palette.Primary1颜色，
primaryColor:palette.primary1Color，
primaryTextColor:palette.primary1Color，
第二种颜色：调色板。第一种颜色，
secondaryTextColor:palette.primary1Color，
禁用颜色：palette.Primary1颜色，
禁用的TextColor:palette.Primary1颜色，
}
}
{儿童}