首页 > 解决方案 > Redux-persist 正在返回初始状态而不是持久化

问题描述

redux-persist在我的代码中添加了它并没有保持状态,而是我总是得到初始状态。

这是我的代码root-reducer

import { combineReducers } from "redux";
import { persistReducer } from "redux-persist";
import storage from "redux-persist/lib/storage";
import userReducer from "./Users/user-reducer";
import cartReducer from "./Cart/cart-reducer";

const persistConfig = {
  key: "root",
  storage,
  whitelist: ["cart"],
};
const rootReducer = combineReducers({
  user: userReducer,
  cart: cartReducer,
});
export default persistReducer(persistConfig, rootReducer);

这是我的store.js文件

import { createStore, applyMiddleware } from "redux";
import logger from "redux-logger";
import rootReducer from "./root-reducer";
import { persistStore } from "redux-persist";

const middlewares = [logger];
export const store = createStore(rootReducer, applyMiddleware(...middlewares));
export const persistor = persistStore(store);

这是我的index.js文件

import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App from "./App";
import { BrowserRouter } from "react-router-dom";
import { Provider } from "react-redux";
import { store, persistor } from "./redux/Store";
import { PersistGate } from "redux-persist/integration/react";
ReactDOM.render(
  <React.StrictMode>
    <Provider store={store}>
      <BrowserRouter>
        <PersistGate persistor={persistor}>
          <App />
        </PersistGate>
      </BrowserRouter>
    </Provider>
  </React.StrictMode>,
  document.getElementById("root")
);

每当我以初始状态刷新我的页面时,我都会得到,rehydrated: true但在触发一些操作后,我得到了rehydrated: false.

标签: javascriptreactjsreduxreact-reduxredux-persist

解决方案


检查你的 reducer.js 并确保文件中 reducer 的底部是

default:
      return state;

并不是

default:
      return {
        ...state,
      };```

推荐阅读