lableStyle属性<Toggle>はonToggle（）で変更されませんmaterial-ui

Question

onToggle（）でlableStyle属性は変更されません。ここにコードがあります。状態で '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)} 
     } 
    } 

/>

Answer 1

この行は動作しません。あなたはこのような状態を更新するとは思わない。

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

これは適切な方法です。

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

リアクションオフィシャルドキュメントで状態を設定する方法について詳しくは、こちらをご覧ください。