問題タブ [redux]

Redux を使用してアプリを作成していますが、Redux connect()ed コンポーネントをまったくレンダリングできません。

このアプリは、babel、babelify、redux、および redux-react を使用しています。

connect() 内でオブジェクトを返すことthis.propsも、コンポーネントで変更されているようには見えませんでした。渡されたdebuggerステートメントは起動しconnectません。

このコードに何か問題がありますか? コンポーネントがレンダリングされないのはなぜですか? debuggerステートメントが起動しないのはなぜですか?

React、Redux、および React-Router 1.0.0-rc1 を使用した小さなプロトタイプがあります。プロトタイプは Webpack を使用してコード分割を行います。現在、次のように追加のルートを非同期ロードするためにgetComponentsandを使用しています。getChildRoutes

ネストされた route に到達するまで、これは正常に機能donations/:idします。次のようになります。

このルート (例: /donations/123) に移動すると、ルートがトリガーされ、bundle.js ファイルが読み込まれ、両方console.logの がコンソールに表示されるため、ルートがメモリに読み込まれたことがわかります。ただし、コンポーネントはマウントおよびレンダリングされません。

console.log の結果:

1 レベルの深さの非同期ルートは問題ありませんが、過去のネストは機能しません。コンポーネントはロードされていますが、実行されているようには見えません。

Connect返されるコンポーネントは、次のように Redux でラップされます。

更新: 問題は解決しました

問題は非常に単純でした。これはネストされたルートだったので、ルーターはネストされたコンポーネントを親に渡していましたがthis.props.children、これはチェックしていませんでした。1.0.0-rc1 の (まばらな) ドキュメントを誤解していると考えてください。

react/redux アプリケーションと一緒に socket.io を使用する方法を理解しようとしており、そうすることでどれだけ最適化できるかを確認しています。したがって、サーバーでは、ここに表示されるソケットを使用した非常に基本的なセットアップがあります。

したがって、通常とは異なる唯一のことは、後で使用するためにリクエスト ヘッダーをアクションに貼り付けただけです。私が試して達成したいのは、このようなものです-

そして追加

これにより、すべての接続をループし、その接続のソケットを使用してその時点で特定のユーザーを呼び出すことができるという考えです。このようなことが可能かどうかはわかりません。ユーザー固有の情報のみを返送する処理について、可能なフィードバックを探しています。また、アクションによって変更された状態の一部 (状態全体ではなく) のみを送り返し、フロント エンド ストアに状態をアセンブルさせることもクールです。どんな/すべての入力も大歓迎です、ありがとう!

エンティティが同じタイプの子を持つことができるレデューサーを実装する方法について、私は少し考えています。

例として reddit コメントを見てみましょう: 各コメントには、コメント自体などを持つことができる子コメントを含めることができます。簡単にするために、コメントはタイプ のレコードであり{id, pageId, value, children}、pageIdreddit ページです。

その周りのレデューサーをどのようにモデル化しますか? レデューサーをマップにすることを考えていました->を使用してページごとにフィルターできるコメントのID pageId。

問題は、たとえば、ネストされたコメントにコメントを追加する場合です。マップのルートにレコードを作成し、その id を親子プロパティに追加する必要があります。すべてのコメントを取得するために必要なすべてのコメントを表示するには、一番上にあるもの (たとえば、orderedList としてページ レデューサーに保持されるもの) をフィルター処理してから、コメント オブジェクトから取得するときにそれらを反復処理します。再帰を使用して子に遭遇します。

それよりも良いアプローチはありますか、それとも欠陥がありますか?