問題タブ [reselect]

私のストアには の配列が含まれていますgoal。connect() を使用して redux ストアに接続する Goal コンポーネントがあるためgoal、小道具として a があります。

ゴール コンポーネントには、派生データを作成するためにすべてのゴール オブジェクトが必要な子があります。このデータがどのように導出されるかを抽出するために reselect を使用したいのですが、すでにゴールにアクセスしているときに、redux ストア全体から同じゴールを再度選択するのは意味がありません。

そのため、私は現在、ゴール コンポーネントからその子にゴール オブジェクトを渡し、その際にセレクターを呼び出しています。

これは、セレクターの引数が、状態のすべてではなく、状態の一部である 1 つの目標であることを意味します。これを使用する方法のすべての例は「接続」を使用するため、セレクター関数は状態全体を取り込みます。

私のアプローチは意味がありますか？それとも、要点を完全に見逃して、ステート ツリーの形状を適切にカプセル化できなくなったのでしょうか。

コメント/アドバイスをいただければ幸いです

結合されたセレクターに追加のパラメーターを渡すにはどうすればよいですか? 私は。。をしようとしています

• データを取得する

• データのフィルタリング

• カスタム値をデータセットに追加 / myValue でデータをグループ化

console.log(myValue)戻り値undefined

redux、react、react-router、および reselect を使用しています。Headerとの 2 つのコンポーネントを含む画面がありますBody。HeaderID を選択するためのコンポーネントがあります。新しい ID が選択されると、新しいアクションがディスパッチされ、redux の状態で ID が更新されます。

その ID に基づいて、サーバーから要素をロードして状態に格納するための非同期 API 呼び出しが必要です。これにより、画面のレンダリングがトリガーされ、要素が に表示されますBody。読み込まれた要素は、reselect を使用して状態から抽出されます。

実際のシナリオはそれよりも少し複雑です。Bodyさまざまな API 呼び出しを持つさまざまなコンポーネントがあり、コンポーネントは 1 つしかないためHeaderです。しかし、それらは別の画面として扱うことができます。たとえば、次のようになります。

画面 1:

コンポーネント: Header、BodyTypeA; 呼び出す API:apiA

画面 2:

コンポーネント: Header、BodyTypeB; 呼び出す API:apiB

私の理解では、API 呼び出しは、新しい ID を状態に格納するときにレデューサーで行う必要があります。しかし、画面間で共有されるコンポーネントによってアクションがディスパッチされた場合、どの画面が表示され、どの API を呼び出すかをどのように判断するのでしょうか? どうにかBodyして ID の変更をサブスクライブし、画面内から API 呼び出しをトリガーすることはできますか? 画面タイプは、react-router によって決定されます。レデューサーはルーターにアクセスして、どの画面が表示されているかを判断できますか? このようなシナリオを処理するためのベスト プラクティスはありますか?

毎秒更新されるストアに接続するコンテナーがあります。

ただし、プロパティの 1 つ (highlightList) は、次の 2 つのいずれかを行います。

1) sessionStorage から値を返す

また

2) ファイルをダウンロードし、それを sessionStorage に保存してから返します

もちろん、私はこれを毎秒やりたくありません。最初だけです。

このようなセレクターを作成しました

しかし、それは機能しません。レンダリングされません。ただし、結果を変数に格納してからクエリを実行する代替バージョンを実行すると、うまくいきます。一度だけ実行し、好きなように実行します

これを正しい方法で行う方法を知りたいのですが、これについての知識を持っている人なら、ベストプラクティスのヒントを教えてもらえますか?

私はreselectとreact reduxを使用しています。基本的なモーダル実装のセレクターを作成しようとしています。

私のセレクターは

のエラーをスローします

編集: select modal と呼ぶ方法を示すように要求されましたが、違いはありません。

これは、モーダル状態のコンテナが見つからないことを意味すると思います

おそらく、レデューサーまたはストアを正しく設定していません。私の減速機は

これは結合レデューサーと結合されてグロブになります

そして私の店に注入されました

reselect 内のエラーは行 73/74 params = dependencies.map にあります。

モーダルにアクセスするには、immutableJS を別の方法で使用する必要がありますか、それともアプリの設定が正しくありませんか? フィードバックをお寄せいただきありがとうございます。

redux 環境でメモ化されたセレクターに reselect を使用しています。reselectのreadmeで、これらのセレクターは構成可能であることに注意してください。つまり、あるセレクターを別のセレクターで使用できます。ここに私のセレクターがあります：

userDataセレクターがセレクターによってどのように使用されるかに注意してくださいsealForSelectedRegion。userDataただし、これらのセレクターを使用およびデバッグすると、 whenがトリガーされて新しい出力が生成される場合、 がトリガーされないことが明らかになりましたsealForSelectedRegion。私の考えでは、入力userDataが更新された結果を生成したため、それをトリガーする必要があり、したがって `sealForSelectedRegion を再計算する必要があります。しかし、これは起こりません。

上記のリンク先の reselect readme にも同様の状況が示されています。私が見ることができる唯一の違いは、readme で構成されているセレクターがエクスポートされていないことです。userDataこの例では、エクスポートして、sealForSelectedRegion への入力として使用したいと考えています。

問題は、なぜ not の更新された出力がuserDataトリガーされないのsealForSelectedRegionかということです。userData輸出されているからでしょうか。もしそうなら、なぜこれが問題なのですか？

We are in the process of implementing performance optimizations in our react/redux application. Part of those optimizations included introducing reselect. This worked nice for data that is derived directly from the state. but what about data that is derived from other props?

Example:

We have 3 components Feed FeedItem and Contact (Contact is a component for displaying a users contact information).

a FeedItem gets an object that represents an item in the feed, one of the properties of a feed item is an actor object. This object is like a user but a bit different (this sucks but can't be changed). This means that if I want to render a Contact for this actor I need to create a new object that maps the properties from an actor to a user. Creating a new object on every render is a performance anti pattern because we are using shallow equality checks.

e.g code:

Is there a pattern for solving this? reselect only supports derived data from redux state, this is basically derived data from props.

ngrx を使用してIonic2アプリを開発しています。

私のストアからデータを選択するには、reselectを使用しています。

同じデータ (同じレデューサーから) を使用するページがいくつかありますが、現在のページに応じて、他のレデューサー データと組み合わせて使用​​します (これは、各ページに独自のリセレクターがあることを意味しますが、このセレクターのそれぞれには少なくとも 1 つのセレクターがあります)。したがって、これらの引数の 1 つが変更されるたびに、これらのページのすべてのリセレクターを再計算する必要があります)。

次のようになります。

私が懸念しているのは、共通の状態が変化するたびに多くのページがある場合、現在のページで使用されているセレクターを再計算する必要がある場合でも、すべてのセレクターが再計算されることです。セレクターが複雑なことを行う必要がある場合、これは大きなパフォーマンスの問題になる可能性があると思います。

そのページに戻るまでストアからの更新を「一時停止」する方法はありますか? このようにして、現在のページのセレクターのみが再計算されます。

または、不要な計算を回避する別の方法はありますか?