問題タブ [react-lifecycle-hooks]

この質問は、React 0.14 に関するリリース ノート (およびその他の関連する誇大広告) を読んで以来、頭の中でぐるぐる回っています。私は React の大ファンであり、ステートレス コンポーネント ( https://facebook.github. io/react/blog/2015/09/10/react-v0.14-rc1.html#stateless-function-components ) は、そのようなコンポーネントを書きやすくすることと、これらのコンポーネントの意図をコードで表現することの両方の点で優れたアイデアです。コンポーネントは、同じ小道具データに対して一貫してレンダリングするという点で「純粋」でなければなりません。

問題は、React がこれらのステートレス コンポーネント関数を完全に独り占めせずに最適化し、props 参照がコンポーネント内で操作されるべきではないという点で不変であるだけでなく、決して変更できないと仮定することをどのように可能にするかです。コンポーネントのライフサイクル外？「通常の」コンポーネント (別名ステートフル コンポーネント - つまり、ライフサイクル全体を通過するコンポーネント、componentWillMount、getInitialState など) にオプションの「shouldComponentUpdate」機能がある理由は、Reactがすべての小道具と状態の参照は完全に不変であると仮定します。コンポーネントがレンダリングされた後、props 参照の特定のプロパティが変更される可能性があるため、同じ「props」インスタンスが後で異なる内容を持つ可能性があります。これが部分的には、完全に不変な構造の使用に多くの興奮があった理由であり、React で Om を使用するとパフォーマンスが大幅に向上する可能性があると言われている理由の 1 つです。そこで使用される不変の構造により、任意のオブジェクトの特定のインスタンスが決して変更されないことが保証されるため、 shouldComponentUpdate は小道具と状態に対して非常に安価な参照等価性チェックを実行できます ( http://swannodette.github.io/2013/12/17/the -future-of-javascript-mvcs/ )。

私はこれについてより多くの情報を見つけようとしていますが、どこにもありません。props データが不変の型で構成されると仮定せずに、ステートレス コンポーネントの周りでどのようなパフォーマンスの改善を行うことができるかを想像することはできません.おそらく、不変でない props 型の予備分析を行って、「props」と「nextProps」が同じデータ？

誰かが内部情報や、これに関する啓発的な洞察を持っているかどうか疑問に思いました. Reactが props 型を「完全に不変」にすることを要求し始めた場合 (データが変更されていないことを確認するために参照の等価性比較を許可する)、それは大きな前進だと思いますが、大きな変化になる可能性もあります。

わかりました、それで、私はcuisineReducer.jsとRecipeReducer.jsを持っている簡単なレシピコレクションアプリに取り組んでいます。

私の管理者ダッシュボードでは、管理者ユーザーは料理グループを作成、削除、編集することができ、料理グループのレシピを作成、削除、編集することもできます。ユーザーが任意の料理グループをクリックすると、料理 ID を使用してレシピ パネルにすべてのレシピが表示されます。ユーザーは、レシピまたは料理グループで「x」を押して削除することもできます。解決する必要がある競合は、レシピが削除されたときです。更新する必要なく、UI からも削除する必要があります。それを達成する方法がわかりません。これが私のコードです。

CuisineReducer.js

CuisineActions.js

レシピレデューサー.js

RecipeActions.js

Admin.js

使用している呼び出しの json データは次のとおりです: getCuisinesByCategory() GET 呼び出し出力: