微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Redux-Persist 不将存储保存到 localStorage

如何解决Redux-Persist 不将存储保存到 localStorage

Redux-Persist 不把 store 保存到 localStorage,有人有什么想法吗?

store.js

 gdal.Grid("trial2.tif","merged2018-19.gpkg",zfield="h_li",algorithm="nearest")

createReducer.js

import { createInjectorsEnhancer } from 'redux-injectors';
import { applyMiddleware,createStore } from 'redux';
import { composeWithDevTools } from 'redux-devtools-extension';
import createSagaMiddleware from 'redux-saga';
import { persistStore,persistReducer } from 'redux-persist';
import storage from 'redux-persist/lib/storage';
import { createReducer } from './createReducer';

export function configureStore() {
  const sagaMiddleware = createSagaMiddleware();
  const middlewares = [sagaMiddleware];

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

  const enhancers = [
    applyMiddleware(...middlewares),createInjectorsEnhancer({
      createReducer,runSaga: sagaMiddleware.run,}),];

  const persistedReducer = persistReducer(persistConfig,createReducer());
  const store = createStore(persistedReducer,{},composeWithDevTools(...enhancers));
  const persistor = persistStore(store);

  return { store,persistor };
}

组件:

import { combineReducers } from 'redux';

export function createReducer(injectedReducers = {}) {
  return combineReducers({
    ...injectedReducers,});
}

app.js

import { bindActionCreators,dispatch } from 'redux';
import { ActionType } from 'typesafe-actions';
import { useEffect } from 'react';
import { createStructuredSelector } from 'reselect';
import { connect } from 'react-redux';
import { useInjectReducer,useInjectSaga } from 'redux-injectors';
import * as Actions from './actions';
import { ComponentReducer } from './reducer';
import { ComponentSaga } from './saga';

function Component({ }: ComponentProps) {
  useInjectReducer({ key: 'Component',reducer: ComponentReducer });
  useInjectSaga({ key: 'Component',saga: ComponentSaga });

  return <></>;
}

type ComponentProps- = {
   // types
};

const mapdispatchToProps = (dispatch: dispatch<ActionType<typeof Actions>>) =>
  bindActionCreators(
    {
      // methods,},dispatch,);

const mapStatetoProps = createStructuredSelector({
  // selectors
});

export default connect(mapStatetoProps,mapdispatchToProps)(Component);

看起来像正常的应用程序结构,但它不起作用。 我认为 90% 的问题在于带有 redux 注入器的动态注入减速器。我尝试使用旧的方式注入,但仍然没用。

import { Provider } from 'react-redux';
import { Router } from 'react-router';
import { PersistGate } from 'redux-persist/integration/react';
import App from './containers/App';
import { configureStore } from '../utils/configureStore';
import { history } from '../appHistory';

const { store,persistor } = configureStore();

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

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。