問題タブ [reactjs-flux]

プロジェクトの 1 つで Flux アーキテクチャを使用しようとしています。

一部のアクションには、そのアクションをディスパッチできるようにするために満たす必要がある前提条件があります。

現在、この前提条件のチェック ロジックは、次のようなビュー コード内にあります (疑似コード):

ビューの内部にビジネス ロジック コードが含まれているため、これは私には厄介に見えます。このチェック コードをストアに入れようと思ったのですが、できません。このアクションを処理する複数のストアがあり、有効かどうかを知っているストアは 1 つだけです。だからうまくいきません：

BarStoreが許可されているかどうかはButtonClickAction、後で尋ねない限りわかりませんWaitFor(FooStore)が、これにより、このアクションを処理するすべてのストアに同じチェックが含まれ、非常に厄介な問題が発生します。

これまでのところ、Flux 内のアクションは、許可されることが保証されている場合にのみディスパッチされることを理解しています。つまり、アクションがディスパッチされる前に、その有効性をチェックする必要があります。これは、この検証がビューにある必要があることを意味しますか?

上記のボタンの例の場合の解決策は、「許可されていないときにボタンを非表示にするだけで、決して起こらない」という単純なものかもしれません。しかし、ユーザーがスペースバーを押したときにディスパッチされる Action があるとしたら、どうすればよいでしょうか? アクションの実行が許可されていない場合、ユーザーのキーボードからスペースバーを削除できません。

PS 私は React を使用していないので、質問は純粋に Flux アーキテクチャ スタイルに関するものであり、JavaScript も使用していません。

大きなコンポーネントを複数の小さなコンポーネントに分割し、それらのデータを集約する最良の方法は何ですか? FormComponent 内の BillingDataComponent、NameComponent、および AddressComponent の状態にアクセスしたいと考えています。

例：

最近、私は Flux アーキテクチャを発見し、React スターター キットを見つけました。良い構造ですが、アプリケーションはブラウザー用にコンパイルする必要があり、node.js から gulp を使用します。

サーバーへの ajax 呼び出しを行うためにreqwestを使用しています。 reqwest には window が必要ですが、node.js では使用できません。( gulp-renderを使用して) ES 6 から ES 5.1 にコンパイルすると、react render はすべてのrequire(..)ファイルを評価し、window が定義されていないためエラーが発生します。これを回避するにはどうすればよいですか? このようなことに対処しなければなりませんでしたか？

私の Fluxxor アプリでは、アクション ハッシュ内から結果を解析するために ajax 呼び出しをプロキシしています。そのモジュール内から応答ペイロードをディスパッチできるようにしたいと考えています。フラックスインスタンスを渡すだけでこれを実行できると言われ、次のようにディスパッチできます。

私のactions.jsファイル:

フラックス インスタンスを api モジュールに渡す方法がわかりませんが、要求ごとに「get」メソッド呼び出しに渡す方法が適切ではありません。

フラックス インスタンスを API モジュールに取り込むにはどうすればよいですか?

アップデート：

node_modules にフラックス lib があることに気付きました。API モジュールでフラックスを要求することはできますか?

それから私はDispatcher.dispatchにアクセスできます..または、これはfluxxorの精神に違反していますか?

更新私のアプローチ全体が間違っていることが判明しました。受け入れられた回答が示唆するように、良い出発点は、React + Flux で構築され、GitHub でホストされているTodoMVCアプリです。

学習目的で非常に小さな React + Flux アプリを構築しています。現時点では、ログイン フォームとコンテンツ (実際にはユーザー名を表示するだけ) のみで構成されています。アプリケーション コンポーネントをアプリ内の唯一のステートフル コンポーネントとして使用し、その状態を小道具として子に送信することを計画しています。しかし、アプリケーションの状態を子 (私の場合は入力フォーム) から更新するためのベスト プラクティスは何かわかりません。おそらく階層に沿ってバブルアップできると思いますが、実際には悪い習慣のようです。また、ログインしたユーザー名をストアに保存する必要がありますか?

これが私が意味することの基本的な例です：

この例では、ここでJSFiddle を設定しました。私の目標は、[username] を警告された文字列に置き換えることです。