2

redux-storage用于在刷新等过程中持久化 redux 状态树。

redux-storage-engine-localstorage作为存储引擎。

我的问题与以下顺序有关:
1)加载此持久状态的操作,以及
2)我在componentDidMount生命周期函数中启动的其他一些操作。

因为存储负载发生我触发的某个操作之后,所以我触发的操作可能还没有发生,因为旧状态会覆盖它。


在我的减速器顶部打印出动作类型,在页面加载时我看到:

action.type @@redux/INIT
action.type HIDE_MODAL
action.type REDUX_STORAGE_LOAD
action.type REDUX_STORAGE_SAVE
action.type FETCH_USER_FAILURE
action.type REDUX_STORAGE_SAVE

该操作是在我的组件方法HIDE_MODAL之一中触发的。componentDidMount

存储负载发生在安装我的根节点之前(在创建我的 redux 存储之后):

import mainReducer from './reducers';
const reducer = storage.reducer(mainReducer);
const storageEngine = createEngine(some key);
const storageMiddleware = storage.createMiddleware(storageEngine);
const middleware = applyMiddleware(
  storageMiddleware,
);
const storageLoad = storage.createLoader(storageEngine);

const store = createStore(
  reducer,
  middleware,
);
storageLoad(store);


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

为什么不会REDUX_STORAGE_LOAD发生在其他所有事情之前,有没有办法确保它发生在其他事情之前?

4

1 回答 1

2

reduxStorageLoaded我最初添加了一个新的状态字段,false并在我的减速器中添加了一个案例:

import { LOAD } from 'redux-storage';

...

const mainReducer = (state = initialState(), action) => {
  switch (action.type) {
    ...
    case LOAD:
      return {
        ...state,
        reduxStorageLoaded: true,
      };
    ...

并将我的整个应用程序包装在基于这个新状态变量的条件中,reduxStorageLoaded因此它仅在变为 时才安装true,即redux-storage完全加载并分派LOAD动作的时间。

于 2017-07-27T03:55:11.197 回答