Question

大家好，我正在使用Reactjs和Material ui做项目，我想更改步进器中活动选项卡的颜色。有什么道具或其他东西可以用来解决这个问题。我正在使用旧版本的reactjs和材质ui 15用于reactjs，使用材质0.16

return (
      <div style={{width: '100%', maxWidth: 700, margin: 'auto'}}>
        <Stepper seconda activeStep={stepIndex}>
          <Step>
            <StepLabel>Select campaign settings</StepLabel>
          </Step>
          <Step>
            <StepLabel>Create an ad group</StepLabel>
          </Step>
          <Step>
            <StepLabel>Create an ad</StepLabel>
          </Step>
        </Stepper>
        <div style={contentStyle}>
          {finished ? (
            <p>
              <a
                href="#"
                onClick={(event) => {
                  event.preventDefault();
                  this.setState({stepIndex: 0, finished: false});
                }}
              >
                Click here
              </a> to reset the example.
            </p>
          ) : (
            <div>
              <p>{this.getStepContent(stepIndex)}</p>
              <div style={{marginTop: 12}}>
                <FlatButton
                  label="Back"
                  disabled={stepIndex === 0}
                  onClick={this.handlePrev}
                  style={{marginRight: 12}}
                />
                <RaisedButton
                  label={stepIndex === 2 ? 'Finish' : 'Next'}
                  primary={true}
                  onClick={this.handleNext}
                />
              </div>
            </div>
          )}
        </div>
      </div>
    );

Answer 1

好吧，你有两个选择：

您可以自定义主题：

theme customization

但最简单的方法是使用inkBarStyle 属性。你可以在文档中看到它.. 示例：

<Tabs inkBarStyle={{background: 'blue'}}>...

使用reactjs和material-ui更改步进器的活动步进颜色

1 个答案: