Fluxの概念について勉強してみたかったので、色んな記事を読み漁り自分なりにまとめてみた。
Fluxの要素
１、View(ReactComponent)
２、Action
３、Dispatcher
４、Store
とりあえずこの４つを覚えればよいらしい。
１、View(React)
・Storeのデータを表示する。いわゆるView
２、Action
・ユーザーが行った操作がAction経由でDispatcherに届けられる。
３、Dispatcher
・Actionを受け付けて登録されたcallbackを実行し、Storeにイベントを通知する。すべてのデータは一旦Dispatcherを通る。
４、Store
・アプリケーションのデータと、ビジネスロジックを担当する。Storeのデータが更新された場合、changeイベントを発行してReactのコンポーネントツリーに更新を通知する。
https://github.com/facebook/flux
↑よくある図
処理の流れ
・Viewで発生したユーザーの操作がActionを経由してDispatcherを呼び出す。
・DispatcherのコールバックとしてStoreの処理を呼び出す。
・Storeは処理が終わるとChange Eventをemitする。
・ViewはStoreのChange Eventをlistenしていて、Change Eventを受け取ると自身のstateを更新する。
以上。
まあ作ってみないとなんとも言えないので、とりあえず作ってみようと思う。
https://github.com/yhikishima/Flux-env