Reduxアプリケーションの動作
さて、用語を学んだことで、 これから作成するReduxアプリケーションの 動作の主要な段階を 簡潔に見ていくことができます。
アプリケーションの動作は、先ほど述べたように、 データの単方向フローの考え方に従って行われます。
初期化段階(アプリケーションの初回起動時)に、 ルートレデューサーを使用してストア(store)が作成されます。 ストアはこのレデューサーを一度だけ呼び出し、 それが返す値を初期状態(initial state)として記録します。 初回のレンダリング時、アプリケーションのコンポーネントは ストアに記録された現在のステート(state)を使用します。 また、それらはステートの変更を即座に知るために、 ストアの更新を購読(subscribe)します。
その後のアプリケーションの動作では、 以下のことが起こります。 例えば、ユーザーがボタンをマウスクリックしたとします。 この場合、コードを用いてアクション(action)が作成され、 それがストアにディスパッチ(dispatch)されます。 ストアは、内部に保持されている現在のステートと 受け取ったアクションを引数として、再びレデューサーを実行します。 その結果、変更されたステートの値が新しい状態として保存されます。 また、ストアは変更を購読しているコンポーネントに、 変更が発生したことを通知します。 次に、コンポーネントは自分が必要とする ステートの部分が変更されたかどうかを確認します。 最後に、変更があった場合、コンポーネントは新しいデータを表示するために 再レンダリングを実行します。