ReactJs状態の変化と値が私の望むものではない

Question

私は練習用のカレンダーアプリを構築しようとしています。私はcurrent_month: 1を持っている、とcurrent_month値が12になったとき、私はcurrent_monthを高めるために機能IncreaseMonth()を持っていますが、状態は

、私はそれは私がそれを行うにはcomponentWillUpdate()ライフサイクルメソッドを使用してみてください1.

に変更したいです、以下のコードで：

componentWillUpdate(prev, next) { 
    if (next.current_month == 13) { 
    this.setState({current_month: 1}) 
    } 
} 

しかし、私は状態を設定するcomponentWillUpdate()を使用しないように私に言うのライフサイクルについてのチュートリアルを、見ます。

これを行うより良い方法はありますか？

Answer 1

正しい方法は、月の値をIncreaseMonth()に移動することです。そのイベントは、コンポーネントが再レンダリングされようとしていることを示すためにトリガされ、そしてあなたは、このメソッド内で決めることができるようあなたがcomponentWillUpdate（）のライフサイクルイベントの状態を設定してはいけません

IncreaseMonth =() => { 
 
    let month = 1; 
 
    if (this.state.current_month < 12) { 
 
    month = this.state.current_month + 1; 
 
    } 
 
    
 
    this.setState({ 
 
    current_month: month 
 
    }); 
 
}

コンポーネントが再レンダリングを続けるかどうかを指定します。このメソッドがtrueを返す場合、コンポーネントは再レンダリングされます。詳細については、official documentation