1つのsetState呼び出しに反応し続けますか？

Question

関数内では、常にsomeStateを設定する必要があり、conditionがtrueの場合はsomeOtherStateに設定する必要があるとします。

this.setState({ someState }); 

if (condition) { 
    this.setState({ someOtherState }); 
} 

それともこれを：

それはこのようにそれを行うことが望ましいですか？私が反応知っ

if (condition) { 
    this.setState({ someState, someOtherState }); 
} else { 
    this.setState({ someState }); 
} 

が立て続けにsetStateを呼び出すと、通常は再レンダリングを生じないように最適化されています。しかし、その動作は保証されているのか、コードはそのような仮定をしなければならないのでしょうか？

など。固定時間間隔で再レンダリングして動作すると仮定します。最初のsetStateがそのインターバルブロックが終了する直前に呼び出された場合、2番目のsetStateは再レンダリングになりますか？

Answer 1

は、なぜあなたは三項演算子を使用していませんか？ conditionがtrueの場合は、新しい状態に設定します。それ以外の場合は、古いものを使用してください。

if (condition) { 
    this.setState(prevState => ({ 
    someState, 
    someOtherState: condition ? newSomeOtherState : prevState.someOtherState 
    })) 
} 

Answer 2

バッチに対してsetState呼び出しが反応するので、順次更新呼び出しを行うと、1回の呼び出しでレンダリングが発生するだけです。

リアクションマネージイベント機能（リアクションイベントシステム）内にいる場合は、バッチ処理されると見なすことができます。たとえば、AJAX呼び出し、またはpromiseやsetTimeoutのようなその他の遅延関数の場合、それらはバッチ処理されません。

EDIT This postは、ほとんどの状況でイベントの順序のかなり良い概要を持っています。あなたは途中でダウンに関する状態セクションを見つけますが、私はここに要約してみます：

注文は行く：

2. の状態の更新ShouldComponentUpdate
3. ComponentWillUpdate
4. は
5. をレンダリングします。 ..

これらのうちの1つの中に複数の機能を持つReactは、バッチ更新を実行する前に完了するまで待つほどスマートです。

（リンク上限：facebook.github.io）/react/docs/react-component.html#setstate

ともバッチ処理に関する議論

インクルードがSETSTATEの詳細についてはこちらのドキュメントを反応させるのを参照してください。ここに：

https://groups.google.com/forum/#!topic/reactjs/G6pljvpTGX0