問題タブ [redux-toolkit]

現在の状態を初期状態にリセットする必要があります。しかし、私の試みはすべて失敗しました。redux-toolkit を使用してそれを行うにはどうすればよいですか?

私は本当に Redux Toolkit を気に入っていますが、安全に無視できる警告がいくつかあります (いくつかのサンクに送信されるアクションのシリアル化できない値。この場合は API) が、それらが表示されないようにしたいです。出荷されたアプリケーションで。

完成したバージョンをブラウザーにデプロイするときに、「serializable-state-invariant-middleware」をスキップするプロダクション モードを有効にする方法が見つからないようです。ミドルウェアのリストを変更して回避できることはわかっていますが、それは非常に扱いにくいようです。

動的な初期状態のペイロードを Redux-Toolkit の initialState オブジェクトに注入するためのよく知られたパターンはありますか?

つまり、私はこれをしたい -

たとえば、{availableRooms: []}初期化時にデータが挿入されない限り、空の配列です{availableRooms: [{...}]}

このパターンは機能しませんが、b/c アクションをディスパッチ可能にエクスポートしたいのですが、このようなものです。

linting ルールに制約されているairbnbため、let でエクスポートできません -

私が求めている機能は、を使用しない方が少し簡単ですcreateSlice。私の質問の理由は、+よりcreateSliceも推奨されている複数の場所を見てきましたが、探している動的データを導入する簡単な方法が見当たらないからです。createActioncreateReducer

私は何も知りませんredux-ormが、私が求めている機能はこのSOの質問に似ていると思います

公式ドキュメントから redux-toolkit を学んでいて、この行に出くわしました-Also, the action creator overrides toString() so that the action type becomes its string representation.どういう意味ですか?

ドキュメントのコードは次のとおりです。

したがって、たとえば、次のようなものを書くとき

ロギングしてINCREMENTいます。これはtoString() のオーバーライドですか? 私は本当に混乱しています。

私はredux-toolkitが初めてで、助けていただければ幸いです。ありがとう。

ReactJS アプリがTypeScriptあり、レデューサーを構築するためにredux使用しています。redux-toolkitアプリが大きくなったので、レデューサーのリファクタリングを開始したいと考えています。

私の還元状態は次のようになります。

customersとのordersスライスは独立しているので、2 つの個別のレデューサーを簡単に作成して、combineReducers後で組み合わせることができます。

ordersここで、減速機をさらに分解したいと思います。

• state1そしてstate2完全に独立しています。
• state3からのデータに依存しますstate1。
• state4state1とからのデータに依存しますstate2。

createReducerfrom redux-toolkit(またはツールキットの他の機能)を引き続き使用して、スライス内のネストされordersた各スライスのレデューサーを作成する方法はありますか?

のレデューサーを書き直し始めたordersので、これまでのところ次のとおりです。

注: 還元状態の構造を制御することはできません。私は使用に完全に縛られているわけではありませんredux-toolkitが、チームがそれを使用しないようにするためには正当な理由が必要です。

通常、サンクでは、他のアクションを呼び出すことになります。

redux ツールキットでは、これcreateAsyncThunkはそれほど簡単ではありません。実際、次の結果のアクションから状態を変更できますextraReducers。

しかし、レシピを開始する非同期の方法も必要です。これには、スライスにレデューサーが必要です。

同じコードを 2 つの場所に記述することを避けるために、サンク ハンドラーから単純なレデューサー関数を呼び出せるようにしたいと考えています。startRecipe(state)ケースから簡単に and startRecipe(アヒルのエクスポート用に分解されていたので、正しい関数を参照していたと確信しています)を試しましextraReducersたが、うまくいきません。

_startRecipe私の現在の解決策は、スライスの外側で定義し、両方の場合でその関数を参照することです

slice.reducersでシンプルなアクションを定義し、サンク ハンドラから参照できる「より良い」方法はありますextraReducersか?

私はドキュメントを読んcreateAsyncThunkでいて、流れに戸惑いました。これはドキュメントからのものです：

andには何を書く必要がreducersありextraReducersますか? 標準のレデューサーロジック?

古いreduxの方法を実装したこのCodeSandboxがあります。今、redux-toolkitそれに実装する必要があります。

私は Redux を初めて使用し、ボイラープレートが多すぎて Redux コードを読んで理解するのが難しいため、プロジェクトで使用しようとはしませんでした。2019 年 10 月に、過剰なボイラープレートの問題を解決し、Redux の使用を容易にすることを目的とした Redux-Toolkit をリリースしたので、現在、古いアプリケーションを React フックと Redux-Toolkit に移行しています。このように物事を学ぶために）そして、どこでなぜuseDispatchフックを使用する必要があるのか​​ よくわかりません。だから私はこの単純なスライスを持っています:

そして、レデューサーとアクションを次のようにエクスポートします。

次に、これらのアクションをインポートして直接呼び出すだけです。

しかし、フックdispatchによって返される でアクションをラップして呼び出す例をたくさん見ます。useDispatchアクションを呼び出すときの目的とuseDispatch、使用すべき場所と使用すべきでない場所は何ですか?

私のsearchSliceにあるものは次のとおりです。

コンポーネントでの使用方法は次のとおりです。

入力フィールドに入力するたびにエラーが発生します。これが私のログです：

テンプレートを使用create-react-appしてアプリケーションをブートストラップしました。redux

私が9歳のようにcreateAsyncThunkを何とどのように使用するかを誰かに説明してもらえますか? アクション文字列は何のためのものですか? ロジック/パスの理由で一時的に作成され、すぐに破棄されますか? アクション文字列で何ができますか / 人々は通常何に使用しますか? 私はドキュメントをずっと見つめていましたが、理解できません。

これは、他の誰かがコードを使用した方法です。誰かがこれを解読できれば、私はとても幸せです.

公式ドキュメント: https://redux-toolkit.js.org/api/createAsyncThunk