問題タブ [redux-thunk]

Reactjs と Redux を使用してアプリケーションに取り組んでいます。リストからアイテムを削除する必要があるという要件があります。ここでは、削除機能は問題なく機能しますが、削除を元に戻すオプションをユーザーに提供する必要があります。私の現在の方法は

ここでは、最初に状態から投稿を削除してから、フェッチ リクエストを呼び出してサーバーから削除します。しかし、そのような機能を元に戻すと、サーバーから削除することはできません。おそらく3秒間取り消しオプションを表示してアクションを実行するのが妥当だと思います。これを達成する方法と、これを実装している他の Web アプリケーションがあるかどうかを教えてください。ありがとう

私は RoR の世界から来て、Redux と React を使用してアプリケーションを変更したいと考えています。

React を理解するのは非常に簡単です。React を構築し、Web ソケットを使用して Redux に接続します (なぜ xhr だけではないのでしょうか?)。Redux はさまざまなアクションを受け入れ、React などに応答します。

私が理解できないのは、すべてのユーザーを redux ストアに保存するのですか? それとも、別の noSQL を使用して保存しますか? また、redux ストアを終了して再起動すると、データは失われますか? これを説明している記事が見つかりませんか?

私は自分の位置を適切に状態に保存できるようにするreact-router-reduxを使用しており、react-routerを使用してルートを定義し、ルート間のリンクを作成できるようにしています。

<Link />1 つの問題は、次のようなコンポーネントを使用してナビゲートする必要がある場合です。

これにより、ルートの変更がトリガーされ、新しいルート (この場合は<Movie />ルート) の読み込み時に、ムービー ページの状態が読み込まれます。

新しいページはナビゲーションで空白になるか、ローダーを配置できますが、実際には新しいページの API 呼び出しが読み込まれるまで新しいページに移動しないため、これはページ間の遷移にはうまく機能しません。pitchfork.comやtheguardian.comなどのサイトに似ています。

この実装はこの質問で説明されており、ページ遷移間でローダーを使用するだけのアプローチがreal-world-exampleとreddit api の例で使用されています

私の質問は、ナビゲートする前に自分のサイトに新しいコンテナ/ルートの状態をロードしたい場合、この質問でdax chenが提案したアプローチに従う必要がありますか?

答えをまとめると、アクションを起動し、redux-thunk を使用して、新しいコンテナー/ルートのアクションを呼び出して状態をプリロードできます。完了したら、react-router-redux のpush()アクションを使用してページに移動します。

これが移行前にページをプリロードするための推奨されるアプローチである場合、このアプローチを使用するようにreact-router-redux-exampleと現在のサイトを変更します。

新しいルートのデータをロードしてナビゲートするアクションは、次のようになります。

呼び出す新しいコンテナーのアクションと、ナビゲートする新しいパスを識別するためのロジックが必要になります。fetchData()新しいページのコンテナ コンポーネントで静的メソッドを呼び出すことができます。

したがって、これはコンポーネントをやや複雑にし<Link />ます。これが正しい方法であるかどうかについてのアドバイスを探しているだけです。または、より単純で推奨されるアプローチを見逃している可能性があります。

これが「落とし穴」なのか、Javascript、React-native、またはそれらの組み合わせのバグなのかはわかりません。React-native アプリに関するいくつかの基本: react-redux、redux-persist、および を使用しredux-thunkます。

バックグラウンドでポーリングし、アプリ内のオブジェクトの更新をフェッチするフェッチがあります。API エンドポイントは、データが変更されていない場合は 304 を返し、データが変更されている場合は、更新されたオブジェクトの配列を返します。基本は次のようになります。

コメントの状態のように、実行するconsole.log(json)と空の配列が返されます。ただし、同じことを再度ログに記録して呼び出すと.length、json更新されたオブジェクトの数が返されます。

lodash を使用して実行するconsole.log(_.clone(json))と、予想される実際の配列が得られます。ただし、コードの下流で「読みやすさ」を維持していないようです。

ログ ステートメントが機能しなくなるため、ダウンストリームで発生することをデバッグできません。この動作の原因は何ですか? これredux-thunkは約束の不適切な実装と関係がありますか?

redux での進行状況を処理して約束するにはどうすればよいですか?

プロミスの実行中に回転するバーなどを表示したいのですが、リクエストを処理するためにaxiosを使用していますが、リクエストの構成オブジェクトで次のように進む進行状況を処理するための API があります。

ただし、次のような redux アクションでのみリクエストを送信できます。

これらの条件で進行イベントを処理するにはどうすればよいですか?

解決済み: フィールド フォームのdefaultValueは、私が思っていたものではありません。

自分が何をしているのかわかりません [化学犬の写真はこちら]。

私のコンポーネントはloadFormと呼ばれ、サンク アクションを介して API 呼び出しからデータをロードします。

}

レンダリング:

this.props.appoは実際に更新されますが、ビューは変わりません:

アップデート

私の減速機が最初からあったので、あなたの助けに感謝します：

複雑さを軽減するために、配列オプションを削除して単純な文字列に置き換えました。また、他のすべてのレデューサーを削除したため、レデューサーは次のようになりました。

それから私は奇妙なことに気づきます：

結果：

したがって、{this.props.eigentumer}は場所 1 と 2 で更新されますが、 defaultValue={this.props.eigentumer}では更新されないため、ビューは更新されません。なぜこれが起こっているのかを知るために、これを読む必要があります。

どうもありがとうございました。