アプリケーションでReact-Reduxを使用しています。問題は、ブラウザのボタンからのユーザのナビゲーションに基づいてReduxの状態を元に戻してやり直したいということです。ユーザーがページAにあり、ユーザーが他のページを参照していると仮定し、ページAにナビゲートします。今すぐユーザーがブラウザのボタンを押すと、ページAに戻りますが、ここではアプリケーションがページAを使用していたときの前の状態を持っています。React-Reduxでのブラウザ履歴の処理
これを解決する集中的な方法はありますか状態の操作を手動で処理する必要はありません。
達成しようとしているのは、React-Reduxのデフォルトの動作です。特定のコンポーネントの状態を操作するアクションをディスパッチしようとしていない場合は、ルートが変更されたときに、追加機能なしで古い状態を維持する必要があります。
私は、新しいルートがコンポーネントを読み込んだときにいくつかのアクションをディスパッチしていると思います。それは、この（それが最終的にコンポーネントを操作させている、存在していたら、例えば残りのAPIからリソースを取得するためにではない）ここで扱うことができる方法：https://github.com/reactjs/redux/blob/master/examples/async/src/actions/index.js#L35
const shouldFetchPosts = (state, reddit) => {
const posts = state.postsByReddit[reddit]
if (!posts) {
return true
}
if (posts.isFetching) {
return false
}
return posts.didInvalidate
}
export const fetchPostsIfNeeded = reddit => (dispatch, getState) => {
if (shouldFetchPosts(getState(), reddit)) {
return dispatch(fetchPosts(reddit))
}
}
それでは、これがやっていることは、それが通過していないということです以前のデータ/状態がそこに残るように、既に存在する場合には、一度経路変更されたコンポーネントへの新しいデータが変更されます。この機能をさらに抽象化して、他のすべてのコンポーネントで簡単に再利用できるようにすることができます。