reduxと反応ルータを使用したディープリンクへの推奨アプローチ

Question

React（15.3.0）、Redux（3.5.2）、およびreact-router（2.6.1）を使用してWebアプリケーションを構築しています。いくつかの関連記事を見てきましたが、これらのライブラリの古いバージョンを参照しています。

私は、ユーザーがそれに深くリンクできるように、URLに保持したい状態があります。ディープリンクとは、ユーザーがページの状態に直接リンクできることを意味します。私は自分のアプリでは、さまざまなページを持って、各ページは別の減速機を持って、各ページの状態はページ間で持続する必要があります。

私はダン・アブラモフの推奨アプローチをお読みになりました。How to sync Redux state and url hash tag params ページ間の持続状態を除けばOKです。

シナリオ例：ページ1の

1. ユーザー地：/page1?state={...}

2. ユーザーに行く：/page1

3. ユーザーがURLに保存する状態を引き起こしてページと対話ページ2：/page2

4. ユーザーはページ2：/page2?state={...}

5. ユーザーはページ1にリンクしています。問題！私たちは1ページからどのように状態を回復させるのですか？

私はreact-router-reduxを見ましたが、必要なものがあるかどうかはわかりません。

この問題には一般的なアプローチがありますか？もしそうなら、それは何ですか？そうでない場合は、アプローチを提案できますか？

Answer 1

これには複数の回答があると確信しています。それを選択して実装するだけです。

それは私だったら、私はこれを行うだろう：

1. 状態
2. のための真実の単一のソースは、いくつかの方法（おそらくReduxのミドルウェア）に格納して更新を購読としてReduxのストアを使用しますページ1の関連する状態が変更されたときのURLパラメータ
3. ユーザーが/page1を訪問した場合、保存された状態を使用します（サーバーを保存/復元するには状態を同期する必要があると仮定しています）。
4. ユーザーが/page1?state={...}を訪問した場合、a）URL状態を保存/回復状態にマージするか、またはb）回復をスキップしてURLを直接使用します。

私は、ユーザーがページをブックマークすることを頼りにしていない限り、無駄な努力のように思えるので、さらに進んでURLに状態を同期させません。 「このURLを共有する」というReactコンポーネントをレンダリングし、適切なクエリパラメータを持つURLをレンダリングさせるだけです。