7

私が開発するアプリケーションは、最初は Flux で構築されました。

しかし、時間が経つにつれて、アプリケーションの保守が難しくなりました。非常に多くのアクションがありました。そして通常、 1 つのアクションは 1 つの場所(ストア)でのみ聴取されます。

アクションを使用すると、すべてのイベント ハンドラー コードを 1 か所に記述しなくても済みます。したがって、これの代わりに：

store.handleMyAction('ha')
another.handleMyAction('ha')
yetAnotherStore.handleMyAction('ha')

私は書くことができます：

actions.myAction('ha')

しかし、私はそのようにアクションを使用することはありません。これは私のアプリケーションの問題ではないことはほぼ確実です。

アクションを呼び出すたびに、store.onSmthHappenの代わりに呼び出すことができaction.smthHappenました。

もちろん、1 つのアクションが複数の場所で処理される場合は例外があります。しかし、それが起こると、何かがうまくいかなかったように感じます。

アクションを呼び出す代わりにストアからメソッドを直接呼び出すとどうなるでしょうか? 私のアプリケーションはそれほど柔軟ではありませんか? いいえ！名前を変更するだけで発生します(まれな例外を除きます)。しかし、なんと費用がかかります！これらすべてのアクションにより、アプリケーションで何が起こっているのかを理解することは非常に難しくなります。複雑なアクションの処理を追跡するたびに、それらが処理されているストアを見つける必要があります。次に、これらのストアで、別のアクションを呼び出すロジックを見つける必要があります。など。

今、私は私の解決策に来ます：

ストアから直接メソッドを呼び出すコントローラーがあります。アクションの処理方法に関するすべてのロジックがストアにあります。WebAPI への呼び出しも格納します (通常、1 つの WebAPI に関連する 1 つのストアとして)。イベントを複数の Store で (通常は順番に) 処理する必要がある場合、コントローラーはストアから返された promise を調整することでこれを処理します。それ自体のプライベート メソッドでのシーケンシャル (一般的に使用される) の一部。また、コントローラーのメソッドは、それらを処理の単純な部分として使用できます。したがって、コードを複製することは決してありません。

コントローラ メソッドは何も返しません (一方向フロー)。

実際、コントローラーには、データを処理する方法のロジックが含まれていません。それは、どこで、どの順序でポイントだけです。

ストアでのデータ処理のほぼ全体像を見ることができます。ストアには、別のストアと対話する方法に関するロジックはありません(flux を使用すると、多対多の関係に似ていますが、アクションのみを介して行われます)。これでストアは、ドメイン モデル (コレクション) のロジックのみを担当する、非常にまとまりのあるモジュールになりました。

フラックスの主な (私の意見では) 利点はまだここにあります。

その結果、データの唯一の真のソースである店舗があります。コンポーネントはストアにサブスクライブできます。また、コンポーネントは以前と同じメソッドを呼び出しますが、代わりに をactions使用しcontrollerます。Reactとのやり取りは全く変わりませんでした。

また、イベント処理も明らかになります。これで、コントローラーのハンドラーを見るだけですべてが明確になり、デバッグがはるかに簡単になります。

質問は：

アクションが流動的に作成されたのはなぜですか? そして、私が見逃したそれらの利点は何ですか?

4

2 に答える 2

4

ビュー上またはサーバーから特定のインタラクションをキャプチャするために実装されたアクションは、好きなだけ多くの異なるストアにディスパッチできます。開発者はこれを facebookchat の例で説明しました。messageStore と threadstore があります。アクションのとき。messagePost が発行され、属性を更新するために異なる作業を行っている両方のストアにディスパッチされました。Threadstore は未読メッセージの数を増やし、messageStore は新しいメッセージをその messagearray に追加しました。

したがって、基本的には、1 つのアクションをチャネリングして、複数のストアでデータ変更を実行します。

于 2014-12-01T13:57:21.157 に答える
2

私はあなたと同じ質問と思考プロセスを持っていましたが、今では Flux アーキテクチャをよりクリーンにするFlummoxを使い始めました。

Store を定義するのと同じファイルでアクションを定義しますが、これで十分です。ディスパッチャーにサブスクライブしてイベントを記録することもできるので、呼び出されているすべてのアクションを確認できます。また、必要に応じてマルチストア アクションを作成するオプションもあります。

すべてのストア関連のコードを 1 つの場所にラップできる素晴らしい FluxComponent が付属しているため、その子は、ストアの変更時に更新されるステートレス コンポーネントです。

  <FluxComponent connectToStores={['storeA', 'storeB']}>
    <InnerComponent />
  </FluxComponent>

Flux アーキテクチャ (裏で Facebook の Flux を使用) を維持することで、GraphQLなどの他のテクノロジを簡単に使用できるようになることを願っています。

于 2015-06-06T16:45:01.477 に答える