如何在redux-toolkit中使用持久化/恢复水化？

npm install redux-persist redux-persist-transform-immutable

import { createTransform } from 'redux-persist';
import { Map } from 'immutable';

// 定义一个转换器，用于将Immutable.js的Map对象转换为普通的JavaScript对象
const mapTransform = createTransform(
  (inboundState) => inboundState.toJS(),
  (outboundState) => Map(outboundState)
);

export const persistConfig = {
  key: 'root',
  storage: localStorage, // 指定存储方式，可以是localStorage、sessionStorage或其他自定义存储方式
  transforms: [mapTransform], // 指定转换方式，这里使用刚刚定义的转换器
};

import { configureStore } from '@reduxjs/toolkit';
import { persistReducer } from 'redux-persist';
import { persistConfig } from './persistConfig';
import rootReducer from './rootReducer';

const persistedReducer = persistReducer(persistConfig, rootReducer);

const store = configureStore({
  reducer: persistedReducer,
});

export default store;

import React from 'react';
import ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { PersistGate } from 'redux-persist/integration/react';
import { persistStore } from 'redux-persist';
import store from './store';
import App from './App';

const persistor = persistStore(store);

ReactDOM.render(
  <Provider store={store}>
    <PersistGate loading={null} persistor={persistor}>
      <App />
    </PersistGate>
  </Provider>,
  document.getElementById('root')
);