如何在React Material UI上更改Stepper颜色? [英] How do you change the Stepper color on React Material UI?

问题描述

在上面的屏幕截图中，我尝试将步骤颜色更改为:绿色表示正确，黄色表示正在进行中，红色表示不正确.

In the screenshot above, I am trying to change the step color to either: green for correct, yellow for in-progress and red for incorrect.

我该怎么办?

推荐答案

旧问题，以防万一有人在找.

Old question but in case anyone is looking.

您需要编辑主题并将其包装在getMuiTheme

You need to edit the theme and wrap it in getMuiTheme

import getMuiTheme from 'material-ui/styles/getMuiTheme'

const muiTheme = getMuiTheme({
    stepper: {
        iconColor: 'green' // or logic to change color
    }
})

<MuiThemeProvider muiTheme={muiTheme}>
    <Stepper>
        ...
    </Stepper>
</MuiThemeProvider>

请参见 https://github.com/callemall /material-ui/blob/master/src/styles/getMuiTheme.js 获取组件及其默认颜色模式的完整列表.

See https://github.com/callemall/material-ui/blob/master/src/styles/getMuiTheme.js for full list of components and their default color schmemes.

您将看到可以按每个组件覆盖颜色和/或更改整体主题颜色.

You will see you can override colors on a per component basis and/or change the overall theme colors.

这篇关于如何在React Material UI上更改Stepper颜色?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！