reactjs - 更改 React Material UI 上的 MobileStepper 颜色

Question

我实现了一个 progress stepper来自 Material UI，但我找不到将其背景颜色从紫色更改为蓝色的方法。

在 documentation 之后我试图通过在 styles 上设置 progress 属性来更改它，但它应用了新的背景颜色而不是更改进度条的颜色...

const styles = {
  progress: {
    backgroundColor: 'blue',
  }
};
<MobileStepper
    variant="progress"
    steps={3}
    position="static"
    activeStep={this.state.activeStep}
    className={classes.progress}
    nextButton={
        <Button size="small" onClick={this.handleNext} disabled={this.state.activeStep === 2}>
            Next
            {theme.direction === 'rtl' ? <KeyboardArrowLeft /> : <KeyboardArrowRight />}
        </Button>
    }
    backButton={
            <Button size="small" onClick={this.handleBack} disabled={this.state.activeStep === 0}>
            {theme.direction === 'rtl' ? <KeyboardArrowRight /> : <KeyboardArrowLeft />}
            Back
        </Button>
    }
/>

现在是这样的:

Answer 1

您是否尝试过设置 color 属性而不是 backgroundColor？

const styles = {
  progress: {
    color: 'blue',
  }
};