Javascript Redux Persistent使Redux状态未定义

我安装了redux-persist，现在我所有的Redux状态都返回未定义.

所有其他Redux状态以前都是有效的，但是一旦我更改为redux-persist，它们就不再有效，并返回未定义状态.我有2个复制切片，一个是UserSlice.js，另一个是modalSlice.js，我只想在UserSlice.js上保持不变

下面是我如何使用它的一个例子:

export default function LoginModal() {
  // Modal
  const isLoginOpen = useSelector((state) => state.modal.loginModalOpen);
  const isSignupOpen = useSelector((state) => state.modal.signupModalOpen);
  const isPasswordOpen = useSelector((state) => state.modal.passwordModalOpen);


<button
  onClick={() => dispatch(openLoginModal())}
  className="btn home__cta--btn"
>

这是我的店铺.js

import { configureStore } from "@reduxjs/toolkit";
import userSlice from "./userSlice";
import storage from "redux-persist/lib/storage";
import { persistReducer, persistStore } from "redux-persist";
import thunk from "redux-thunk";

const persistConfig = {
  key: "root",
  storage,
};

const persistedReducer = persistReducer(persistConfig, userSlice);

export const store = configureStore({
  reducer: persistedReducer,
  devTools: process.env.NODE_ENV !== "production",
  middleware: [thunk],
});

export const persistor = persistStore(store);

Userslice.js:

import { createSlice } from "@reduxjs/toolkit";

const initialState = {
  email: null,
  uid: null,
  premium: false,
  type: "Basic",
  currentUser: null,
};

const userSlice = createSlice({
  name: "user",
  initialState,
  reducers: {
    setCurrentUser: (state, action) => {
      state.currentUser = action.payload;
    },
    signOutUser: (state) => {
      state.email = null;
      state.uid = null;
      state.premium = false;
    },
    typeOfSubIsYearly: (state) => {
      state.type = "Premium Plus";
    },
    typeOfSubIsMonthly: (state) => {
      state.type = "Premium";
    },
    setPremiumStatus: (state, action) => {
      state.premium = action.payload;
    },
  },
});

export const {
  setCurrentUser,
  signOutUser,
  upgradeUser,
  typeOfSubIsYearly,
  typeOfSubIsMonthly,
  setPremiumStatus,
} = userSlice.actions;

export default userSlice.reducer;`

下面是我的app.js:

import "@/styles/globals.css";
import { library } from "@fortawesome/fontawesome-svg-core";
import {
  faCrown,
  faStar,
  faStarHalf,
  faUser,
  faX,
} from "@fortawesome/free-solid-svg-icons";
import { Provider } from "react-redux";
import { persistor, store } from "@/redux/store";
import { PersistGate } from "redux-persist/integration/react";

library.add(faCrown, faStar, faStarHalf, faUser, faX);

export default function App({ Component, pageProps }) {
  return (
    <Provider store={store}>
      <PersistGate loading={null} persistor={persistor}>
        <Component {...pageProps} />
      </PersistGate>
    </Provider>
  );
}