Reactカレンダーを作成しています。最初はhtml、次のように、予定を使用してカレンダーを宣言したかっただけです。
<Calendar appts={appts} />
しかし、その後、自分のカレンダーは完全なアプリである必要があり、RESTエンドポイントと通信し、独自のstoreとを持っている必要があることに気付きましたactions。
カレンダーは最終目標ではありませんでした。今では、より大きな「Flux」アプリの一部にする必要があります。カレンダーなどの部分を他のアプリで再利用できるように、誰もが自分のアプリをどのように設計していますか？異なるFluxアプリはどのように相互に通信しますか？これが話題になっている例やブログ投稿はありますか？
Fluxは、Facebookからのパブリッシャー/サブスクライバーアーキテクチャの推奨事項です。RefluxJSは、このアーキテクチャの使いやすい実装です。これは、追加actionsしてstoresReactJSに。
アクションは変更のトリガーです。ユーザーがページを操作するたびに、アクションを呼び出します。私にとって、アクションはReactコンポーネント内のsetStateをほぼ完全に置き換えました。ユーザーがフォームフィールドの変更などのイベントを作成するときに、イベントデータを関数パラメーターとして使用してアクションを実行します。このアーキテクチャでは、アクションにより、Reactコンポーネント（クラス）が公開の変更をブロードキャストできます。
ストアはアクションをサブスクライブ（リッスン）します。最も単純なストアは、this.trigger呼び出しで変更されたパラメーターを渡すだけです。他のストアは、this.trigger呼び出しで新しいデータセットをブロードキャストするよりも、他のストアをリッスンしたり、データを検証したり、パラメーターをデータに詰め込んだり、データをオブジェクトに設定したり、データを配列にプッシュしたりできます。
Reactコンポーネント（クラス）とストアはストアにサブスクライブ（リッスン）できます。これらのストアが更新されると、次のことができます
Refluxにはconnect、クラスの状態をストアにリンクできる非常に便利なミックスインが付属しています。ただし、これを行う場合は、必ずストアにgetInitialStateを実装してください。それ以外の場合、クラスはnull状態で始まります。もう1つの便利なミックスインは、ListenerMixinストアが変更されたときにコンポーネントに何かを実行させたい場合です。
詳細については、必ずRefluxJSREADMEを確認してください。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加