問題タブ [react-redux]

React コンポーネントをテストしようとしていますが、次のエラーが発生します。

不変違反: 「Connect()」のコンテキストまたは小道具のいずれかで「ストア」が見つかりませんでした。ルート コンポーネントを <Provider> でラップするか、明示的に「store」を prop として「Connect()」に渡します。

テストでコンポーネントをレンダリングしているときにエラーが発生します。

ページにコンポーネントをレンダリングするときに問題なく動作します。ただし、テストでは、ストアをコンポーネントに明示的に渡すことができません。

誰かが正しい方向を指すことができますか?

アプリケーションの通知状態を更新するアクションがあります。通常、この通知はエラーまたは何らかの情報です。次に、通知状態を最初の状態に戻す 5 秒後に別のアクションをディスパッチする必要があるため、通知はありません。これの背後にある主な理由は、通知が 5 秒後に自動的に消える機能を提供することです。

別のアクションを使用して返すことに運がsetTimeoutなく、これがオンラインで行われる方法を見つけることができません。ですから、どんなアドバイスでも大歓迎です。

React Components の Victory Library の VictoryBar を使用して棒グラフをプロットできません。データベースのデータを使用して、Redux と axios ミドルウェアを使用してデータを前面に出しています。

ペイロードは更新されていますが、たとえば React コンポーネントの状態は大きくなるだけです。1 つの国からのデータは、オブジェクトの配列 = 26 を提供します。もう一度ボタンをクリックすると、オブジェクトが連結され、52 個のオブジェクトの配列になります。これは、データを更新していないため、グラフをゆがめます。

The VictoryBar: React の VictoryBar チャート

入力ボックスの入力を更新すると、チャートが更新されるように、チャートの状態を更新する方法がわかりません。this.state.processedの情報を更新するために使用していVictoryBarます。this.props.waterDataは Redux Promise から受け取ったデータで、国ごとに適切なデータが返されthis.state.waterDataますが、Plot Graph をクリックするたびに に連結されます。Plot Graph をクリックするたびに、新しいプロットを生成したいと思います。

それは私の間違いでした。私はすでにそれを修正しており、Plot Graph Button をクリックしたときにコンポーネントの状態を更新する方法をたくさん試しました。より明確にするために、アクション リデューサーと、ここで達成しようとしているもののスクリーンショットを貼り付けます。

アクション リデューサー (get_water_data.js)

動作するコードを更新しましたが、配列を変更していて、スプライスを使用しています。これは、グラフのプロットをクリックするたびに、画面に新しいデータをレンダリングする正しい方法ではありません。これを正しい方法で実装しようとしていますが、方法がわからないと思います。

各国の改善された水資源を示す VictoryBar チャート

Reduxとreact-reduxでReact Nativeをテストしたところ、Redux のステート ツリーの内容がコンテナを介して渡されない場合、表示に反映されないことがわかりました。

これをテストするために私は使用します

• 反応ネイティブ 0.19.0
• 反応還元 4.1.2
• 還元3.1.7

@alinzin がhttps://github.com/alinz/example-react-native-reduxでこのプロジェクトをセットアップするためのすべてのトリックを説明しているように。他に良い解決策はありますか？

次の例は、Redux ストアの状態としての単純な文字列と、文字列を拡大するための単純なアクションを示しています。

これは、状態の単一の文字列としてのreduceとdataです。

登録したアプリはこんな感じで目新しいものはありません。最初のルートは、App1Component のコンテナーを起動します。これが良好なバインディング状態とコンポーネントへの道です (私は信じています)

コンポーネント App1Component と App2Componenet の両方のメイン コンテンツは単純なコンポーネントであり、文字列を表示するだけで、拡大アクションをディスパッチするための「ボタン」を表示します。

コンポーネント App1 と App2 の間に違いはありません。App1Component だけが Container (およびバインド状態とアクション) を介して呼び出され、App2Component は (App1Component から) Navigator ですべて同じ props (App1Component と同じ) をプッシュすることによって呼び出されます。

次のシーンを App2Component にプッシュし、コンテナを介してバインドされる前に同じ小道具を渡すためのボタンを備えた App1Component があります。

ここで「拡大」を押すと文字列が拡大され、画面にアクションが反映されているのがわかります。また、redux logger のトレースを chrome で見ることができます。

App1Component のラッパー コンテナ

そして、ここにコンポーネント 2、戻るボタンがあります。ここで「拡大」を押すと文字列が拡大され、確かにchrome上でトレースが確認できるのですが……画面にアクションが反映されていません。

[戻る] を押すと、App1Component の変更された文字列が画面に表示されます。

ご覧のとおり、私は何か根本的なことを誤解していましたが、本質的なことではありません。

すべてのメイン コンポーネント (ページ/シーン) をコンテナーで装飾する必要がありますか? Navigator で passPros を介して props (以前はコンテナにバインドされていた) を渡すのが間違っているのはなぜですか? アクションは正しくディスパッチされますが、画面には反映されません。

どんな助けでも大歓迎です。ありがとう