我已经创建了一个组件来给Redux重置状态的能力，你只需要使用这个组件来增强你的存储和分派一个特定的动作。类型触发重置。执行的想法和Dan Abramov在他们的回答中说的是一样的。

Github: https://github.com/wwayne/redux-reset

使用Redux，如果应用了以下解决方案，它假设我已经在所有的reducers(例如{user: {name, email}})中设置了initialState。在许多组件中，我检查这些嵌套的属性，所以有了这个修复，我防止我的渲染方法在耦合属性条件上被破坏(例如if state.user。如果上面提到的解决方案，电子邮件将抛出一个错误用户是未定义的)。

const appReducer = combineReducers({
  tabs,
  user
})

const initialState = appReducer({}, {})

const rootReducer = (state, action) => {
  if (action.type === 'LOG_OUT') {
    state = initialState
  }

  return appReducer(state, action)
}

我发现Dan Abramov的回答很适合我，但它触发了ESLint no-param-reassign错误- https://eslint.org/docs/rules/no-param-reassign

下面是我如何处理它，确保创建一个状态的副本(这是，在我的理解，Reduxy的事情要做…):

import { combineReducers } from "redux"
import { routerReducer } from "react-router-redux"
import ws from "reducers/ws"
import session from "reducers/session"
import app from "reducers/app"

const appReducer = combineReducers({
    "routing": routerReducer,
    ws,
    session,
    app
})

export default (state, action) => {
    const stateCopy = action.type === "LOGOUT" ? undefined : { ...state }
    return appReducer(stateCopy, action)
}

但是也许创建一个状态的副本，然后把它传递给另一个减速器函数，它会创建一个状态的副本，这有点过于复杂了?这篇文章读起来不太好，但更切题:

export default (state, action) => {
    return appReducer(action.type === "LOGOUT" ? undefined : state, action)
}

你可以通过将此代码添加到动作文件中来清空减速器的数据，

首先导入所有类型:

import * as types from './types';

将此代码添加到注销操作

for(let key of Object.values(types)) {
        dispatch({ type: key, payload: [] });
    }

首先，在应用程序启动时，减速机的状态是新鲜的，并带有默认的InitialState。

我们必须添加一个动作，调用APP初始加载持续默认状态。

当注销应用程序时，我们可以简单地重新分配默认状态，reducer将像新的一样工作。

APP主容器

  componentDidMount() {   
    this.props.persistReducerState();
  }

主APP减速器

const appReducer = combineReducers({
  user: userStatusReducer,     
  analysis: analysisReducer,
  incentives: incentivesReducer
});

let defaultState = null;
export default (state, action) => {
  switch (action.type) {
    case appActions.ON_APP_LOAD:
      defaultState = defaultState || state;
      break;
    case userLoginActions.USER_LOGOUT:
      state = defaultState;
      return state;
    default:
      break;
  }
  return appReducer(state, action);
};

注销时调用重置状态的动作

function* logoutUser(action) {
  try {
    const response = yield call(UserLoginService.logout);
    yield put(LoginActions.logoutSuccess());
  } catch (error) {
    toast.error(error.message, {
      position: toast.POSITION.TOP_RIGHT
    });
  }
}

我已经创建了一个组件来给Redux重置状态的能力，你只需要使用这个组件来增强你的存储和分派一个特定的动作。类型触发重置。执行的想法和Dan Abramov在他们的回答中说的是一样的。

Github: https://github.com/wwayne/redux-reset