You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
There are separate storage engines for local storage and sync storage. Import the one you need,
or both, and pass them as storage engines when configuring your store.
// configureStore.jsimport{combineReducers,createStore}from'redux'import{persistStore,persistReducer}from'redux-persist'import{localStorage,syncStorage}from'redux-persist-webextension-storage'importlocalStorageReducerfrom'./localStorageReducer';importsyncStorageReducerfrom'./syncStorageReducer';constlocalStorageConfig={key: 'localStorage',storage: localStorage,}constsyncStorageConfig={key: 'syncStorage',storage: syncStorage,}// Persist each of the storage areas under different keys and with different storage engines.constrootReducer=combineReducers({localStorage: persistReducer(localStorageConfig,localStorageReducer),syncStorage: persistReducer(syncStorageConfig,syncStorageReducer),})exportdefault()=>{conststore=createStore(rootReducer)constpersistor=persistStore(store)return{ store, persistor }}
Accessing local/sync storage directly
react-redux prefixes storage keys with "persist:" + config.key. If code needs to access storage
directly instead of through Redux, it can construct the key and access the APIs like the following:
// Example config passed to `persistReducer`constkey='localStorage';constlocalStorageConfig={
key,storage: localStorage,}// …chrome.storage.local.get([`persist:${key}`],(items)=>{constrootParsed=JSON.parse(items['persist:localStorage']);// Keep in mind that each reducer must be parsed separatelyconstsomeReducer=JSON.parse(parsed.someReducer);// `someReducer` will be the contents of the reducer of that name when last persisted});