1. ホーム
  2. javascript

[解決済み】ReduxアプリでlocalStorageに書き込む場所は?

2022-04-15 11:59:49

質問

ステートツリーの一部をlocalStorageに永続化したいのですが、どうすればよいですか?これを行うには、どのような場所が適切でしょうか?リデューサーかアクションか?

どのように解決するのですか?

なぜなら、リデューサーは純粋で副作用がないものでなければならないからです。

サブスクライバーでやることだけをお勧めします。

store.subscribe(() => {
  // persist your state
})

ストアを作成する前に、それらの永続化されたパーツを読み込んでください。

const persistedState = // ...
const store = createStore(reducer, persistedState)

を使用する場合 combineReducers() を使用すると、状態を受け取っていないリデューサは通常通りデフォルトの state 引数の値です。これはかなり便利です。

サブスクライバをデバウンスして、localStorageにあまり速く書き込まないようにすることをお勧めします。

最後に、代替案としてそれをカプセル化したミドルウェアを作成することもできますが、私ならサブスクライバーから始めますね。