問題タブ [reactjs-flux]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
2 に答える
474 参照

stream - ストリームは Flux アプリにどのように適合しますか?

サーバーで実行されているコマンド ライン プログラムの出力を出力する webappがあります。この出力は、RxJS ストリーム( source ) を使用して送信されます。

私はこのアプリを (ReactJS の人々からの) Flux アーキテクチャでリファクタリングしようとしていました。これはアプリの流れを一方向に強制します:

また、この Flux アプリケーションでストリームをどのように使用すればよいかわかりません。

  1. すべてのストリーム イベントが Dispatcher に対して新しいアクションを起動する必要がありますか? それとも、ストアでストリームを聞いて、ディスパッチャをスキップする必要がありますか?

  2. 仮想 DOM での ReactJS の再レンダリングが原因で、一定のストリーム入力によってアプリが壊れることはありますか?

  3. Flux ビデオで、Dispatcher は前のアクションが完了する前に受け取った新しいアクションを無視すると聞いたことがありますが、これは、ストリームで作成されたアクションが頻繁にイベントを発生させると無視される可能性があるということですか?

0 投票する
2 に答える
5766 参照

reactjs - React-router: ルートを介してデータを渡す

ルートを介してデータを渡す最良の方法を見つけようとしています。params を使用できることはわかっていますが、params に属さない特定の種類のデータがあります。

例: アプリケーションのリストを表示するインデックス ページがあります。各アプリケーションの横には、そのアプリケーションのビューに移動するためのボタンがあります。

アプリケーション自体を Application ハンドラに渡したい。ただし、アプリケーション全体を params で渡すのは意味がありません。アプリケーション識別子をparamsに渡すことは理にかなっていますが(つまり、:idまたは:name)

したがって、私がこれを行うべきだと思う方法は、アプリケーション識別子を params に渡すことです。次に、Application コンポーネントで、ID を指定して適切なアプリケーションを ApplicationStore で検索します。

ただし、アプリケーション自体を渡す方が簡単で高速ではないでしょうか? これを行う方法はありますか。これをしない理由はありますか?

ここにいくつかのコードがあります:

<Link to="showApplication" params={{name: application.name}}>View</Link>

また

<Link to="showApplication" params={{application: application}}>View</Link>

前もって感謝します!

0 投票する
1 に答える
135 参照

reactjs - React と Flux: Aync 呼び出しの処理

ユーザーがアプリケーションを作成できるページである反応コンポーネントがあります。ユーザーが [作成] をクリックすると、非同期呼び出しが行われます。非同期呼び出しが成功した場合は、ディスパッチャーにアクションについて知らせます。それ以外の場合、エラーを受け取った場合、ディスパッチャーに通知せず、代わりにエラー テキストをレンダリングします。

これは、他の人がそのようなシナリオを処理する方法ですか? これは正しいアプローチだと思いますが、ディスパッチャが非同期呼び出しを処理する必要があると考える部分があります。ただし、エラーが発生したことをビューに通知する方法がわかりません。ビューを再レンダリングしてエラーをプロップとして渡すこともできますが、このアプローチでは複雑さが増しすぎているようです。

ありがとう!

0 投票する
1 に答える
9256 参照

reactjs-flux - React ディスパッチャー WAITFOR

react.js の waitFor 関数を使用しようとしていますが、何か間違っているようです。

私がやりたいことは、基本的に、店がいっぱいになるのを待ってから、別の店から呼び出すことです。1.1号店にトークンを登録

2.他店での待ち合わせを書く

残念ながら、私の getall() メソッドは空のオブジェクトを返します (getAll() は適切に記述されています)。そのため、waitFor ディスパッチャー関数が機能していないようです。

基本的には、最初のストアがまだサーバーから回答を受け取っているためだとわかっていますが、waitFor はそれがフェッチされるのを待つと思っていました。

どんな手掛かり ?ありがとう!

編集: 最初のストア フェッチを tha のように起動します。私が理解していないのは、バックボーンコレクションがフェッチされたらロードをディスパッチしていることです (私は約束で成功したときにディスパッチします...)

また、呼び出されることのないアクションに waitfor をバインドしようとしましたが、他のストアはまだ待機していません! 変 !

0 投票する
1 に答える
119 参照

reactjs - Store から取得したデータをコントローラー ビュー内に保持するかどうか。

React docs によると、状態は UI 状態にのみ使用する必要があるため、Store から取得したデータが UI 状態であるかどうかがわかりにくくなっています。

Store からアイテムのリストを取得し、それをコンポーネントにレンダリングする必要があるとしましょう。それは次のとおりです。

  1. 状態として保存
  2. コンポーネントのプロパティ内に保存 (必須forceUpdate)

メソッド内の Store からデータを取得することも考えられますrender。これは、コンポーネント内にデータを保持する必要はまったくありませんが、forceUpdateStore の変更時に呼び出す必要があります。

0 投票する
1 に答える
383 参照

javascript - Flux/reactjs を使用してコントローラー ビューでレンダー コールを減らす方法

反応するフラックス アーキテクチャのプロジェクトに取り組んでいます。私のコントローラービューは次のようになります

レンダリング関数にいくつかのネストされたビューがあり、一部のビューで行われたすべての変更により、コントローラー ビューのレンダリング関数が実行されます。これにより、ネストされたすべてのコンポーネントのレンダリング機能も実行されますが、唯一の変更は UserControl コンポーネントです。ネストされたコンポーネントのレンダリング関数をすべて実行する必要はありません。

どうすれば修正できますか?
フラックスアーキテクチャーの挙動ですか?
レンダリング関数の呼び出し回数を減らすには?

0 投票する
1 に答える
2351 参照

javascript - EventEmitter と facebook のディスパッチャ

私は Flux アーキテクチャで反応を使用しています。
Store を定義するには、次のようなことをしなければならないことを Web で読みました。

私が理解している限り、EventEmitter と facebook のディスパッチャには多くの共通点があります。たとえば、両方ともイベントを発行 (またはディスパッチ) できます。
私の質問は、なぜ EventEmitter とディスパッチャーの両方が必要なのですか? 冗長ではありませんか?EventEmitter に必要な動作も含むディスパッチャーを作成する方がよいのではないでしょうか?

0 投票する
1 に答える
2156 参照

reactjs - ストアでアクションをトリガーすることは悪い習慣ですか?

ストアは、アクションによってトリガーされたイベントを処理し、リスニング ビュー コントローラーに変更を送信することになっています。

たとえば、リクエストのコールバックで、またはストアの登録済みコールバックで直接、アクションをトリガーしても問題ありませんか。

例えば:

このようなコードは Flux アーキテクチャで「正しい」ものですか?

ありがとうございました !

====== コメントに基づく更新:

これは、「これをしなければならない。どうすればよいか」という問題ではなく、「これがやり方であるべきだ」ということです。そして、答えは...あなたの選択だと思います。

コメントにいくつかの便利なリンクが追加されました。ありがとうございます。

私の理解は次のとおりです。

Flux アーキテクチャでは、ビューはアクションをトリガーする唯一のものであるべきです。アクションクリエーターに非同期リクエストを入れると、コールバックが新しいアクションを起動するはずです。

Flux の手順に従わない場合、ストアは非同期リクエストを処理することもできますが、コールバックがデータを直接処理せず、代わりに別のアクションをトリガーするようにしてください。これに関する Bill Fisher の回答を参照してください。

いずれにせよ、Ben Alpert の回答が述べたように、ユーザー アクションに対して複数のアクションを作成できます (例: REQUEST_START、REQUEST_SUCCESS、REQUEST_ERROR)。これにより、リクエストのさまざまな段階にフックできます。

これに関する更新は大歓迎です。

0 投票する
1 に答える
5739 参照

zurb-foundation - Facebook ReactJS と Zurb Foundation for Apps?

Zurb Foundation (SASS、特に Zurb Foundation for Apps) が好きですが、Facebook ReactJS と Flux で使用したいと考えています

つまり、AngularJS を削除し、ReactJS / Flux に置き換えます。この目標に向けて、Kiran Abburi は素晴らしいスタートを切りました。

https://github.com/akiran/react-foundation-apps

http://webrafter.com/opensource/react-foundation-apps

Facebook ReactJS / Flux で Zurb Foundation for Apps をこのように使用することの長期的な実行可能性について、人々はどう考えていますか?

技術とエコシステムの両方の観点から (更新など)。

あるいは、Zurb Foundation (または Twitter Bootstrap) のような CSS フレームワークは、ReactJS / Flux でまったく有益です。

ありがとう、アシュリー。