错误：redux-persist：持久密钥“mykey”的持久超时

Question

我正在引导一个使用 Redux + Saga + Persist 的新 React 应用程序。我已经有许多使用相同模式制作的其他应用程序，但对于这个全新的应用程序，我在超时后重新水化时得到 redux-persist: persist timed out for persist key "mykey" （我的应用程序在超时之前完全是空白的）。

这是我的相关代码：

import { combineReducers, createStore, applyMiddleware, Middleware } from "redux";
import localforage from 'localforage'
import { PersistConfig, persistReducer } from "redux-persist";
import logger from 'redux-logger'
import { connectRouter } from 'connected-react-router'
import { createBrowserHistory } from 'history'
import { routerMiddleware } from 'connected-react-router'
import { dataReducer } from "state";
import createSagaMiddleware from "redux-saga";

const middlewares:Middleware[] = [];

const persistConfig : PersistConfig<any> = {
    key: "mykey",
    timeout: 5000,
    version: 1,
    storage: localforage, // yup, I've added the package
    migrate: migrate as any,
    whitelist: ['data'] // also tried without "whitelist" key at all, same
} 

export const history = createBrowserHistory();


function migrate(state:PersistedGlobalState, versionKey:number){
  if(state && state._persist && (state._persist.version === versionKey)){
    return Promise.resolve(state); //same version, return the state.
  }
  return Promise.resolve({});
  
}

const reducerMap = {
    data: dataReducer, //coming from another file with the reducer/state code
    router: connectRouter(history)
}

export const rootReducer = combineReducers(reducerMap);
const persistedReducer = persistReducer(persistConfig, rootReducer);

if (process.env.NODE_ENV === 'development') {
    middlewares.push(logger);
}
const sagaMiddleware = createSagaMiddleware();
middlewares.push(sagaMiddleware);
middlewares.push(routerMiddleware(history));

export const store = createStore(persistedReducer, applyMiddleware(...middlewares))

这是我在创建的每个应用程序中几乎使用的模式。他们都工作。

在 App.tsx 中，我有：

function App() {
  return (
    <StateWrapper>
        <div>
            ...
        </div>
    </StateWrapper>
  );
}

export default App;

其中 StateWrapper 是：

import { Provider } from "react-redux";
import { Persistor, persistStore } from "redux-persist";
import { PersistGate } from "redux-persist/integration/react";
import { store } from "./configure";

export function StateWrapper(props:{children:any}){
    const persistor: Persistor = persistStore(store);
    return (<Provider store={store}>
        <PersistGate persistor={persistor}>
            {props.children}
        </PersistGate>
    </Provider>)
}

基本上，我将在第一个代码段中导出的商店提供给提供程序。我做错了什么？