问题:在用户注销时重置 redux 存储/状态

我正在制作一个健身应用程序并遇到了一个我认为不会太难解决的问题,但我被卡住了。

当用户 1 注销和用户 2 登录时,用户 2 将拥有用户 1 的锻炼日志,直到他们刷新页面。这是因为退出时状态未清除锻炼日志。

我试图在我的 sessionReducer 中解决这个问题,但没有成功。

如果 currentUser 为空,我对 if 条件的想法是传回一个空状态。 Null 通过我的注销 thunk 操作传回。

我不确定我可以制作什么其他动作创建器来帮助解决这个问题。

我的减速器和注销如下。

import merge from 'lodash/merge';

import { RECEIVE_CURRENT_USER, RECEIVE_ERRORS } from '../actions/session_actions'

const nullUser = Object.freeze({
  currentUser: null,
  errors: []
});


const sessionReducer = (state = nullUser, action) => {
  Object.freeze(state);
  let newState;

  switch(action.type) {
    case RECEIVE_CURRENT_USER:
      if (action.currentUser === null) {
        newState = merge({}, {});
     } else {
       newState = merge({}, state);
     }
      const currentUser = action.currentUser;
      return merge({}, newState, {
        currentUser
      });
   case RECEIVE_ERRORS:
     const errors = action.errors;
     return merge({}, nullUser, {
        errors
     });
   default:
     return state;
  }
}

 export default sessionReducer;

Thunk 动作创建者。

export const logout = () => (dispatch) => {
  return APIUtil.logout().then(() => dispatch(receiveCurrentUser(null)),
    err => dispatch(receiveErrors(err.responseJSON)));
};

解答

要在注销后清除存储,我通常会执行以下操作:

const createReducer = () => {
  const reducer = combineReducers({
    app: appReducer,
    // rest of your reducers
  });
  return (state, action) => {
    if (action.type === 'SIGN_OUT') {
      state = undefined;
    }
    return reducer(state, action);
  };
};

您可以在此处阅读有关清洁商店问题的更多信息。