問題タブ [redux]

store.dispatch を直接使用することに不利益はありますか?

(すべての子コンポーネントで使用できるため) 呼び出しがはるかに簡単に思えますが、これまでのテストでは、まだ違いを見つけていません。

ありがとう！

redux を react-router と一緒に使用する方法を理解するのに苦労しています。

index.js

App.js

Show.js

これはスローします

キャッチされていない TypeError: 未定義のプロパティ 'マップ' を読み取ることができません

私が見つけた唯一の解決策は、{children} の代わりにこれを使用することです:

これは本当に適切な方法ですか？

API呼び出しを伴う非同期アクションがある場合、アクションが関数を返す可能性があります：

または、オブジェクトを返し、ミドルウェアを使用してそれを傍受し、何かを行います。

ここで私の質問は次のとおりです: asyncAction がディスパッチされる前の状態にロールバックするにはどうすればよいですか。これは基本的に、最後の API 呼び出しを元に戻すための API 呼び出しを使用して、状態 (成功/失敗 => 要求) に2 ステップ戻ることを意味します。
たとえば、todo アイテム (非同期アクション) を削除した後、ポップアップ スナックバーに元に戻すオプションが表示されます。クリックすると、削除された todo アイテムが UI に追加され、db に戻すための API 呼び出しが行われます。

redux-undoを試してみましたが、このような問題を解決するためのものではないと感じています。または、「元に戻す」
を忘れて、ユーザーが元に戻すオプションをクリックしたときに、まったく新しいaddTodoアクションをディスパッチする必要がありますか?

前もって感謝します ：-）

作成、読み取り、更新、および削除に使用される 1 つのフォームを取得しました。同じフォームで 3 つのコンポーネントを作成しましたが、それらに異なる小道具を渡しました。CreateForm.js、ViewForm.js (削除ボタンで読み取り専用)、UpdateForm.js を取得しました。

以前は PHP を扱っていたので、これらは常に 1 つの形式で行っていました。

React と Redux を使用してストアを管理しています。

CreateForm コンポーネントを使用しているときは、サブコンポーネントにこの props を渡してcreateForm={true}、入力に値を入力せず、無効にしないようにします。私の ViewForm コンポーネントでは、この props を渡しますreadonly="readonly"。

そして、値で満たされ、更新できないテキストエリアで別の問題が発生しました。値を持つ React textarea は読み取り専用ですが、更新する必要があります

フォームのこれらのさまざまな状態を処理するコンポーネントを 1 つだけ持つ最適な構造は何ですか?

共有するアドバイス、チュートリアル、ビデオ、デモはありますか?

redux-api-middlewareに到達する前に、ユーザーの OAuth AccessToken をAPI_CALL陽イオンに追加する責任がある Redux Middleware を作成しています。

ただし、ユーザーの AccessToken の有効期限が切れたことをこのミドルウェアで検出することも必要です...

これが発生すると、ミドルウェアはアクションを保留し (nextチェーン内のミドルウェアに渡されないようにします)、内部リストに格納します。次に、非同期を開始します。「リフレッシュ アクセス トークン」FSA のディスパッチによるトークン リフレッシュ プロセス:

最後に、「アクセス トークンの更新」フローがいつ完了したかをリッスンし、保留中のすべてのアクションをフラッシュ (再ディスパッチ) したいと考えています。AUTHENTICATION_RESPONSE現在、 FSA が私のミドルウェアを流れるときに、FSAを監視することでこれを行っています(アクションは、サンクAUTHENTICATION_RESPONSEの副作用としてディスパッチされます)。refreshAccessToken

ただし、FSA が実際にレデューサーをヒットするという確実性がないため、このアプローチには満足していませんAUTHENTICATION_RESPONSE(他のミドルウェアによって傍受されるか、さらに延期される可能性があります)。

私が検討した可能な代替アプローチは、refreshAccessTokenactionCreator に Promise を返すサンクを返させることです。そうすれば、ミドルウェアはすべてのリクエストをフラッシュして再生する前に、その約束が解決するのを待つことができます。

または、ミドルウェアでストアを直接監視し、値が変更されたときにアクションをトリガーすることもできますが、ミドルウェアがストアを監視するためauth.accessTokenのガイダンスが何であるかは明確ではありません (ミドルウェアが必要なため、不可能だと思います)最終的なストア オブジェクトが作成される前にインスタンス化されます)。

ありがとう ：）

アップデート

帰り道に問題を考える。実際の認証ロジックをrefreshAccessToken(サンクされたアクション クリエーター) からミドルウェア自体に移動すると、多くの手間が省けます。

ユーザーのリスト (詳細を含む) またはログ レコードのリストを返す管理者レポートのリストなど、いくつかのデータ テーブルがあるとします。この情報は、データ テーブルだけがこの情報を必要とする redux ストアに属していますか? または、5000 個のノードで何かをプロットしている場合はどうでしょうか。これも redux single app 状態に属しますか? なぜですか、そうでないのですか？

これらのアイテムがアプリの状態に属していない場合、これらを redux なしでロードする必要があるのはローカル コンポーネントの状態だけですか? ただし、すべての非同期リクエストが同様にフェッチされるのはいいようです。

私は現在、React アプリケーションの設計でこの問題に直面していますが、答えが見つからないようです。

したがって、私のアプリケーションには、React Router のコンポーネントの次の階層があります。

アプリ -> DynamicContainer -> -> LoginComponent

現在、LoginComponents には、ユーザー名とパスワードを取得するためのフォーム要素があります。

ログインが処理される userActionCreators があり、終了時にログインが正常にディスパッチされますが、LoginComponent を接続してアクションをディスパッチしたり、actionCreators を呼び出したりする正しい方法を見つけることができないようです。

どうすればいいのですか？任意の提案をいただければ幸いです。

こんにちは！

行が変更された場合にのみ消える、テキストエリア内で複数行のプレースホルダーを実行する簡単な方法 (または、下部にある代替ソリューション) を見つけようとしています。したがって、基本的に、これがテキストエリアの初期状態である場合 (またはそれが何であれ)

ユーザーは最初の質問をクリックして、次のAように入力します。

これまでに 3 つの異なるソリューションについて考えてきましたが、どれを優先するかはわかりません。

1) テキストの領域とは別にレンダリングされるゴースト コンテンツがある。

2) テキストエリアを使用する代わりに、テキストエリアとなる行ごとに 1 つの入力を行います。問題は、テキストエリアの動作を実装することですが、代わりに多くの入力を使用することです。ただし、行ごとにプレースホルダーを持つことは簡単です。

3) 実際のテキストを用意し、何らかのパーサーを使用して、必要に応じてテキストを追加/削除します。

私が得ることができるヘルプ/ポインタに感謝します。

私は React と Redux を使用していますが、インスピレーションを得ることができる他のテクノロジを含む回答を得られてうれしいです。