問題タブ [normalizr]

エンティティ/データの isFetching を redux に保存する一般的な方法を作成しようとしています。現在、normalizrを使用して、すべてのエンティティ データをエンティティ ハッシュに格納しています。例えば

データがフェッチされているかどうかを指定するために、各エンティティ (人、注文など) オブジェクトのプロパティを定義することを考えていました。これに関する唯一の問題は、Object.keys のようなことを行うと、配列に ID + isFetching のリストが返されることです。これを克服するために、プロパティを列挙できないように設定したいと思います。

私のデータはかなり複雑です。エンティティが 2 つだけではありません。例として単純化しました。私のコードベースで長期的に存続できるソリューションを探しています。

これは良い解決策ですか？メタデータを格納するためだけに新しいオブジェクトを作成したくありませんでした (ただし、これは解決策になる可能性があります)。より良い、またはより一般的なアプローチはありますか?

私はこれが少し意見が分かれていることを知っていますが、還元問題のガイドラインは私にstackoverflowを指摘しました...

注意 Object.defineProperty との互換性の問題を認識しています。これは内部アプリケーションであり、全員が最新バージョンの chrome を使用しています。

アップデート

redux ストアでの潜在的な実装

注意してください！バグの原因に関する私の仮定が間違っていたため、質問は混乱を招き、関連性がない可能性があります。問題はレデューサーにあり、データを表現する方法ではありませんでした。

ということで、質問の正解はjpdelatorreさんのものですが、 Joaoさんはバグそのものについてです。

ネストされたオブジェクトの配列であるサーバーからの JSON 応答があるとします。店舗での取り扱いをできるだけ簡単にするためにそれを平らにする方法は？次のような正規化ツールを使用しようとしました。

しかし、あまり役に立たないので、間違っていると思います。ストアはまだ複雑すぎるため、リデューサーで再帰的なものを使用して状態を更新する必要があります。

さらに、深くネストされた状態では、浅い比較しかconnect()行わないため、react-redux での作業も非常に困難になります。

応答の形状は次のようになります。

redux-thunkとnormalizrを使用してデータ スキーマを作成しています。最初に、fetch 呼び出し (表示されていません) から請求書のリストを取得します。次に、応答内の各アイテムに対して、請求書の ID を使用して、その請求書に関連する条件を取得するために別の API 呼び出し (以下を参照) を行います。そのデータは、外部フェッチ応答では提供されません。

各請求書の用語の正規化されたエンティティを取得し、州に発送する前に、各エンティティ オブジェクトを、関連する請求書のリストを含むコピーに置き換えます。

(以下のコードは正常に動作しています。)私の質問は次のとおりです。プロパティが追加されtermEntities[key]た自身のコピーでそれぞれを置き換えている場合、それrelatedBillsは変異としてカウントされますか? ディスパッチする前に normalizr エンティティ データをいじっても大丈夫ですか、それとも悪い習慣ですか?

ありがとう！

https://github.com/paularmstrong/normalizrを使用して、redux ストアのネストされたデータを正規化することに頭を悩ませています。

ユーザーがログインすると、その情報と他のデータ型との関係を含む応答が返されます。

}

多くのチュートリアルを読んだ後、正規化されたデータはこの形状で最もよく表現されると思います。

これは、すべての関係タイプのスキーマを作成するということですか?

ウェブサイト 本 映画 興味 美徳 特徴 強み 教師

そして、ネストされたすべてのスキーマで定義される1つの relationshipSchema ? 関係のすべてのタイプは、サイト外のさまざまな領域で参照されます。

ex) 彼らが関心を選択するページで、私はすべての関心の応答を受け取ります。

私もノーマライズ...

記事、チュートリアル、ビデオの例など、どんな助けも大歓迎です。

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

私のストアには、次のように設定されたユーザーの配列があります。

私のプロジェクトは、次のように設定されたサーバーから JSON データを受信して​​います。

user_id渡されたデータの が既存のユーザー セットuser_idと一致する場所を見つけ、スコアをscore渡された に更新したいと考えています。

たとえば、レデューサーが受け取った場合、元の状態でユーザー ID が等しい場所に{user_id:2, score:10}変更する方法を教えてください。もちろん突然変異は避けながら！score102

これを使用する最良の方法は何ですか？ノーマライズ？ロダッシュ？アップデート（）？非常に単純に思えますが、ここで明らかな何かが欠けているに違いありません。ありがとう。

私はそれを理解していません。これはすべて錬金術であり、フロントエンド開発を容易にするという約束は、それらの約束を実現するために適切に混合しなければならないさまざまな要素を覆い隠しています。間違ったものを混ぜているか、チャントの調子がずれています。知らない。

これは質問の組み合わせになります。たぶん、すべてを入力すると、どこが間違っているように見えるかを理解するのに役立ちます。

API レスポンスを平坦化するために normalizr を使用しています。そのようなものを使用する必要があることを理解するのに少し時間がかかりました. redux でオブジェクトの配列と戦うのはしばらくの間楽しかったですが、今は旅のフラット化応答段階にあります。したがって、私の API 応答は人のリストを返し、normalizr はそれを次のようにストアに分割します。

なぜ人々は2つのキーの深さを持っているのですか? 知らない。レデューサーを他の方法で動作させることができませんでした。私は人々が使用しているのを見た例で行きます。これが私のレデューサーです（関連する部分を示すために簡略化されています）：

それはうまくいきます。素晴らしい！APIからさらに人を追加したいまで。なんらかの理由で、このレデューサーにさらに人をドロップすると、追加するのではなく、すべてを置き換えるだけです。わかりましたので、私はこれを間違っています。もう少し調査すると、マージ機能を持つ Lodash と呼ばれるものが生まれます。完全！私はストアで結果をマージしているのではなく、それらを置き換えているに違いありません (または、そのように見えます)。それでは、リデューサーで Lodash を使用して、結果を置き換えるのではなくマージしてみましょう。

よし、見た目もいいし、ちゃんと動く！結果は置き換えられるのではなくマージされます。そして、この方法には、リデューサーに追加の people キーを追加する必要がないという追加の利点があります。そのため、実際に多くのコードを変更して、余分な人のキーを使用しないようにしました。Lodashが結果配列のキーを複製していることに気付くまで。

このようなものの多くは本当に新しいようです。物事を行うための「正しい」方法や、どのツールが最も効果的かについて、人々はまだ考えを巡らせているようです。少なくとも、さまざまなガイド、README、およびドキュメントを精査すると、そのように見えます。それらはすべて、異なるアプローチを使用するように指示しています (そして、それらはせいぜい数か月しか離れていません)。

この時点では、五芒星、ろうそく、詠唱が効果的だと思いますが、誰かがここで適切な材料を手伝ってくれることを願っています. 私はReactを使用しているため、Reduxが必要になり、Normalizrが必要になり、明らかにLodashが必要になりました。あれは正しいですか？私はそこで正しい道を進んでいますか？そうでない場合、フロントエンドの状態管理を耐えられるプロセスにするための最小限のツールセットは何ですか? 概念的には、自分が取り組んでいるものを気に入っていますが、ばかげているほど多くの落とし穴があります。

レデューサー:

この最初のコンソール ログは、reducer が 1 回使用された後の状態です。それは私が店に述べた最初の人々のセットを持っています:

2 番目のコンソール ログは、追加される新しいユーザーのペイロードになります。

次に、3 番目のコンソール ログは 2 つの状態を組み合わせたものである必要がありますか? しかし、それはサリーとアナで最後のものを繰り返すだけで、他のすべてを上書きします.