Redux - 尝试添加一个函数来 configureStore

Question

我正在尝试将我的 redux 持久化到 localStorage，但我不知道如何将它添加到 redux-toolkit 的 configureStore 函数中。

错误：

'{ reducer: { progress: Reducer; } 类型的参数 }; 持久状态：任何；}' 不能分配给 'ConfigureStoreOptions<{ progress: number; 类型的参数。}, AnyAction>'。对象字面量只能指定已知属性，并且类型 'ConfigureStoreOptions<{ progress: number; 中不存在 'persistedState'。}, AnyAction>'。

代码：

localStorage.ts

export const loadState = () => {
  try {
    const serializedState = localStorage.getItem("state");
    if (serializedState === null) {
      return undefined;
    }
    return JSON.parse(serializedState);
  } catch (err) {
    return undefined;
  }
};

索引.tsx

import React from "react";
import ReactDOM from "react-dom";
import App from "./App";
import counterSlice from "./store/reducers/counterSlice";
import { configureStore } from "@reduxjs/toolkit";
// import throttle from "lodash.throttle";
import { Provider } from "react-redux";
import { loadState, saveState } from "./store/localStorage";

const reducer = {
  progress: counterSlice
};
const persistedState = loadState();
const store = configureStore({
  reducer,
  persistedState
});

store.subscribe(() => {
  saveState({
    progress: store.getState().progress
  });
});

ReactDOM.render(
  <Provider store={store}>
    <App />
  </Provider>,
  document.getElementById("root")
);

Answer 1

我是 Redux Toolkit 的创建者。 persistedState不是 的有效配置选项configureStore。 正确的字段名称是preloadedState.