文章/答案/技术大牛

发布

社区首页 >问答首页 >如何重置ngrx 9的整个存储？

问如何重置ngrx 9的整个存储？
EN

Stack Overflow用户

提问于 2020-07-27 11:15:02

回答 2查看 1.4K关注 0票数 1

我已经看到了同样的奇怪的here，但是由于我使用了ngrx9，我认为应该有一些不同的解决方案。我在应用模块中的代码和还原器如下所示

.....
StoreModule.forRoot(
  reducers,
  {
    metaReducers,
    runtimeChecks: {
      strictStateImmutability: true,
      strictActionImmutability: true
    }
  }),
 ...

我进口的减速器是

export const reducers: ActionReducerMap<AppState> = {
  [friendsReducer.friendsFeatureKey]: friendsReducer.reducer,
  [authReducer.authFeatureKey]: authReducer.reducer,
  ...
};

export const metaReducers: MetaReducer<AppState>[] = !environment.production ? [] : [];

我的LOGOUT操作存储在auth.actions中。那么，我应该如何包括根还原器来重置所有状态呢？

angular

typescript

redux

ngrx-store

回答 2

Stack Overflow用户

回答已采纳

发布于 2020-07-27 11:22:20

只需添加metareducer以清除状态即可。

export function clearOnLogoutMetaReducer(reducer) {
   return function(state, action) {
      if(action.type === logout.type) {
        return reducer(undefined, action);
      }
      return reducer(state, action);
   }
}

并将其添加到元还原器数组中。

票数 2

Stack Overflow用户

发布于 2020-09-29 23:33:58

公认的答案是我经常在StackOverflow上看到的建议，不幸的是，这是你永远不应该做的事情。

问题

如果将状态设置为潜在的未定义状态，将遇到以下几个问题：

您连接到存储区的任何

(通常只是选择器)，都必须以一种考虑到潜在未定义值的方式编写。这样很快就会变得丑陋，如果出错，可能很难找到错误。

如果

Javascript引擎所操作的对象具有相同的“形状”，它们的性能会更好。这个主题很复杂，但是基本思想是，如果对象具有相同的形状，编译器可以使用内联缓存优化操作(这里有一篇关于主题的更详细的文章：https://mrale.ph/blog/2015/01/11/whats-up-with-monomorphism.html)。如果通过使状态未定义而重置状态，则状态对象会更改形状，因此会丢失一些性能。在大多数应用程序中，这可能不会产生明显的影响，但需要注意的是.

您破坏了redux设计模式的基本原则之一，即您应该维护一个具有一致接口的集中式状态存储。redux设计模式的一个卖点是，如果您遵循它，您就知道您的应用程序状态将始终具有一致的接口，并且您不必担心状态的某些部分不存在，以及可能导致的问题。这就是为什么还原器总是从初始状态对象创建的，并且状态属性是在加载其提供程序而不是动态添加到状态时急切地创建的。如果通过将状态设置为未定义来重置状态，则将失去此保证以及一大块redux的值。

解决方案

要清除存储，您需要分派一个操作，该操作将简化为一个新的初始状态对象。ngrx/redux最重要的一点是，动作是沿着单个流分派的。这意味着一个特性存储中的减缩器(在您的例子中是“朋友”)可以在另一个存储中侦听操作(在您的例子中是'auth')。因此，在您的friends.reducer.ts中执行如下操作：

  import * as AuthActions from 'wherever/your/auth/actions/are';
  
  // Replace this with actual interface
  export interface FriendsState {
    friends: string[];
  }

  // Replace this with actual object
  export const initialFriendsState:FriendsState = {
    friends: [],
  }

  export const reducer = createReducer(
  initialFriendsState,
  on(AuthActions.LOGOUT, (state: FriendsState) => ({...initialFriendsState})),
  on(FriendsActions.GET_FRIENDS (state: FriendsState, {friends}) => ({...state, friends}) 
  //...whatever other reducers you have in your friends store
);

票数 2

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/63114137

复制

相似问题

问如何重置ngrx 9的整个存储？
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何重置ngrx 9的整个存储？EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何重置ngrx 9的整个存储？
EN