const reducer = (state = initialState, { type, payload }) => {

   switch (type) {
      case RESET_STORE: {
        state = initialState
      }
        break
   }

   return state
 }

你也可以触发一个动作，由所有或部分还原器处理，你想重置到初始存储。一个动作可以触发你整个状态的重置，或者只是适合你的一部分。我相信这是最简单、最可控的方法。

下面的解决方案对我很有效。

我添加了重置状态功能到元还原器。关键在于使用

return reducer(undefined, action);

将所有减速器设置为初始状态。返回undefined反而会导致错误，因为存储的结构已经被破坏。

/还原剂index.ts

export function resetState(reducer: ActionReducer<State>): ActionReducer<State> {
  return function (state: State, action: Action): State {

    switch (action.type) {
      case AuthActionTypes.Logout: {
        return reducer(undefined, action);
      }
      default: {
        return reducer(state, action);
      }
    }
  };
}

export const metaReducers: MetaReducer<State>[] = [ resetState ];

app.module.ts

import { StoreModule } from '@ngrx/store';
import { metaReducers, reducers } from './reducers';

@NgModule({
  imports: [
    StoreModule.forRoot(reducers, { metaReducers })
  ]
})
export class AppModule {}

一种方法是在应用程序中编写一个根减速器。

根减速机通常会将处理操作委托给combineReducers()生成的减速机。但是，无论何时它接收到USER_LOGOUT操作，它都会再次返回初始状态。

例如，如果你的根减速器是这样的:

const rootReducer = combineReducers({
  /* your app’s top-level reducers */
})

你可以将它重命名为appReducer，并编写一个新的rootReducer委托给它:

const appReducer = combineReducers({
  /* your app’s top-level reducers */
})

const rootReducer = (state, action) => {
  return appReducer(state, action)
}

现在我们只需要教新的rootReducer返回初始状态以响应USER_LOGOUT操作。如我们所知，无论操作如何，当调用以undefined作为第一个参数时，约简器都应该返回初始状态。让我们用这个事实来有条件地剥离累积状态，当我们把它传递给appReducer:

 const rootReducer = (state, action) => {
  if (action.type === 'USER_LOGOUT') {
    return appReducer(undefined, action)
  }

  return appReducer(state, action)
}

现在，每当USER_LOGOUT触发时，所有减约器都将重新初始化。它们还可以返回与初始值不同的值，因为它们可以检查动作。也要打字。

重申一下，完整的新代码是这样的:

const appReducer = combineReducers({
  /* your app’s top-level reducers */
})

const rootReducer = (state, action) => {
  if (action.type === 'USER_LOGOUT') {
    return appReducer(undefined, action)
  }

  return appReducer(state, action)
}

如果使用redux-persist，可能还需要清理存储空间。Redux-persist将您的状态副本保存在存储引擎中，刷新时将从那里加载状态副本。

首先，您需要导入适当的存储引擎，然后在将其设置为undefined并清除每个存储状态键之前解析状态。

const rootReducer = (state, action) => {
    if (action.type === SIGNOUT_REQUEST) {
        // for all keys defined in your persistConfig(s)
        storage.removeItem('persist:root')
        // storage.removeItem('persist:otherKey')

        return appReducer(undefined, action);
    }
    return appReducer(state, action);
};

为什么不直接使用return module.exports.default();)

export default (state = {pending: false, error: null}, action = {}) => {
    switch (action.type) {
        case "RESET_POST":
            return module.exports.default();
        case "SEND_POST_PENDING":
            return {...state, pending: true, error: null};
        // ....
    }
    return state;
}

注意:确保你设置动作默认值为{}，你是可以的，因为你不想在检查动作时遇到错误。在switch语句中输入。

onLogout () { this.props.history.push(' /登录');//发送用户到登录页面 window.location.reload ();//刷新页面 ｝

我在使用typescript时的解决方案，建立在Dan Abramov的答案之上(redux类型使得不可能将undefined作为第一个参数传递给reducer，所以我将初始根状态缓存在一个常量中):

// store

export const store: Store<IStoreState> = createStore(
  rootReducer,
  storeEnhacer,
)

export const initialRootState = {
  ...store.getState(),
}

// root reducer

const appReducer = combineReducers<IStoreState>(reducers)

export const rootReducer = (state: IStoreState, action: IAction<any>) => {
  if (action.type === "USER_LOGOUT") {
    return appReducer(initialRootState, action)
  }

  return appReducer(state, action)
}


// auth service

class Auth {
  ...

  logout() {
    store.dispatch({type: "USER_LOGOUT"})
  }
}