lableStyle属性<toggle>在onToggle（）material-ui上不会改变

Question

lableStyle属性在onToggle（）material-ui上没有改变，这里是代码。我在状态中声明'labelstyle'属性，但是在调用onToggle（）时它不会呈现。

constructor(props) {
    super(props);
    this.state = {
      toggled:false,
      labelstyle:'red'
    };

<Toggle
 label="Remind Me"
 elementStyle={{color:'purple', backgroundColor:'cyan'}}
 defaultToggled={this.state.toggled}
 thumbStyle={styles.thumbOff}
 trackStyle={styles.trackOff}
 thumbSwitchedStyle={styles.thumbSwitched}
 trackSwitchedStyle={styles.trackSwitched}
labelStyle={this.state.labelstyle}
onToggle={()=>{this.state.toggled = !this.state.toggled;
             {console.debug('toggled ------'+this.state.toggled)}
       this.state.toggled ? this.state.labelstyle= 'green' :
                       this.state.labelstyle='red';
            {console.debug('labelstyle ------'+this.state.labelstyle)}
       }
    }

/＆GT;

Answer 1

此行不起作用。你不应该像这样更新状态。

onToggle={ () => {this.state.toggled = !this.state.toggled} };

这是正确的方法。

onToggle={ () => {this.setState({toggled: !this.state.toggled}) };

请阅读有关在React官方文档中设置状态的更多信息。