Localstorage with react-redux

Question

私はSPAにreactとreduxを使用しています。私はローカルにいくつかのデータを保存したいと思います。また、appStateとlocalstorageを同期させる必要があるため、ページを更新してもデータが失われることはありません。お願い助けて。私は反応と還元のために全く新しいですし、何が起こっているのか分からないが、私はreduxがアプリケーション全体の状態を作成すると思うので、私はアプリケーションコンポーネントcuzのlocalstorageで自分の状態をバインドすることはできませんコンポーネントの状態だけで、私のアプリではありません。 （アプリケーションのライフサイクルの理解に役立つ良いチュートリアルもあります）

Answer 1

私は、次のコマンドでローカルストレージにデータを保存することをお勧めします。

localStorage.setItem('nameForData', variableNameForData);

を必要なときにデータを取得するには：

はのlocalStorageのデータがコマンドで行うことができます設定してください。 localStorageからデータを削除するには

var variableNameForData = localStorage.getItem('nameForData')

：

localStorage.removeItem('nameForData')

これらは通常のlocalStorageを使用したアプリケーションの相互作用を追跡するいくつかのブールの状態を変更するために派遣して、アクションクリエイターの内側に置かれます。

たとえば、ローカルストレージが作成されたときに状態がtrueに設定されている可能性があります。

ローカルストレージが存在するかどうかを確認するアクションクリエータを呼び出し、そのブール値をtrueに戻すか、存在しない場合はローカルストレージを作成してからtrueに設定することができます。

componentWillMount(){}にこの関数を入れることができます。これは、コンポーネントが最初にレンダリングされたとき、したがってリフレッシュのときに呼び出されます。

Docs for component life cycle and specifically componentWillMount here

Docs for local storage here

Answer 2

私はあなたがそれぞれのアクション後の状態を保存するために提案することができます。そのためには、localStorageミドルウェアを使用して、状態オブジェクト全体だけを格納します。

次に、createStoreの部分では、localStorage APIからのinitialStateを取得します。あなたは、任意のコンポーネントを変更する必要があるのlocalStorageから初期状態をジュストと状態に答えため