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
