Redux-persist 不工作：页面刷新清除状态

Question

为了在页面刷新时保持状态，我正在尝试集成 redux-persist。但是，它不起作用。页面刷新清除状态。下面是 _persist 对象 int 状态的样子：

_persist: {
   version: -1,
   rehydrated: true
}

这里是 configureStore.js:

import { createStore, applyMiddleware, compose } from "redux";
import logger from "redux-logger";
import thunk from "redux-thunk";
import rootReducer from "./_reducers/rootReducer";
import storage from "redux-persist/lib/storage";
import { persistStore, persistReducer } from "redux-persist";
const persistConfig = {
    key: "root",
    storage,
    whitelist: []
};
const persistedReducer = persistReducer(persistConfig, rootReducer);
const middlewares = [thunk];
// if (__DEV__) react native check dev
middlewares.push(logger);

const store = createStore(
    persistedReducer,
    {},
    compose(
        applyMiddleware(...middlewares),
        window.devToolsExtension ? window.devToolsExtension() : f => f)
);
const persistor = persistStore(store);

export { store, persistor };

而且，这里是 index.js

import React from 'react';
import ReactDOM from 'react-dom';
import { Router } from 'react-router-dom';
import App from './App';
import registerServiceWorker from './registerServiceWorker';

import { Provider } from 'react-redux';

import { PersistGate } from "redux-persist/lib/integration/react";
import { store, persistor } from "./configureStore";



const baseUrl = document.getElementsByTagName('base')[0].getAttribute('href');
const rootElement = document.getElementById('root');

ReactDOM.render(
    <Router basename={baseUrl} history={history}>
        <Provider store={store}>
            <PersistGate loading={null} persistor={persistor}>
                <App />
            </PersistGate>
        </Provider>
    </Router>,
    rootElement);

registerServiceWorker();

我无法找出代码的问题。有帮助吗？

Answer 1

const persistConfig = {
    key: "root",
    storage,
    whitelist: ["pass reducer name which you want to persist in string"] e.g: whitelist: ["userAuth", "widgetAuth"]
};

如果你想让你的整个状态持续存在，而不是从 persistConfig 中删除白名单密钥

Answer 2

React Native Expo。在我的情况下，同样的问题在更新 expo 版本后发生。

解决方案：

// import FSStorage from "redux-persist-expo-fs-storage";
import FSStorage from "redux-persist-fs-storage";
/* 
Import change 
*/
const primary = {
  key: "root",
  timeout: 0,
  version: 1,
  keyPrefix: "",
  storage: FSStorage(),
  stateReconciler: autoMergeLevel2, // see "Merge Process" section for details.
};

添加键前缀：“”，在配置中。希望这个解决方案对其他人有用。

Redux-persist 不工作：页面刷新清除状态

Redux-persist is not working: Page refresh clears the state

reactjs

redux

react-redux

redux-persist