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

【问题标题】：Redux-persist is not working: Page refresh clears the stateRedux-persist 不工作：页面刷新清除状态
【发布时间】：2019-08-07 11:49:02
【问题描述】：

为了在页面刷新时保持状态，我正在尝试集成redux-persist。但是，它不起作用。页面刷新清除状态。以下是_persist object 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();

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

【问题讨论】：

标签： reactjs redux react-redux redux-persist

【解决方案1】：

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

如果您希望整个状态保持不变，而不是从 persistConfig 中删除白名单键

【讨论】：

【解决方案2】：

对于 React Native 博览会。在我的情况下，更新 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.
};

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

【讨论】：