Question

如果另一个状态部分已更改，我需要删除一个状态值。我应该如何从NgRx中的reducer访问其他商店零件？

我的商店架构：

a: {...}
b: {...}

我需要从具有'a'特征库的化简器访问到在另一个化简器中初始化的'b'特征库。

Answer 1

您可以通过@ ngrx / effects解决该问题。

效果监视动作流并过滤动作并对其做出反应。

您在操作效果中的过滤器，该操作更改相关部分，并调度另一个操作，该操作更改商店的其他部分。（您只需将新操作恢复为效果）

@Injectable()
export class MovieEffects {

  loadMovies$ = createEffect(() => this.actions$.pipe(
    ofType(ActionsOfA.ChangeAction),    // which changes the related part
    map(action=>ActionsOfB.RemoveOtherPart  // dispatch
    )
  );

const aReducer = createReducer(initialState,
  on((ActionsOfA.ChangeAction, {payload}), state => ({...state, a: payload}))
);

const bReducer = createReducer(initialState,
  on(ActionsOfB.RemoveOtherPart, state => ({...state, b:{} )
);

在过滤后的操作中，如果需要的话，还有有效负载。

Answer 2

在化简函数中，您无法访问其他功能的状态。这是正常现象，也是一件好事。减速器是纯函数。

如official doc所述：

NgRx中的还原器负责处理应用程序中从一个状态到下一个状态的转换。 Reducer函数通过根据操作的类型确定要处理的操作来处理这些转换。

尽管如此，在技术上还是可以的：

在功能A的化简器中处理功能B中声明的动作。
为功能B中在功能B中声明的动作设置效果。

但是要小心，即使有可能，也应该照顾好您的体系结构，以避免出现问题并确保可维护性。

如果另一个状态部分已更改，我需要删除一个状态值。怎么样我应该从NgRx中的reducer访问其他商店零件吗？

在这种情况下，我建议您在发生来自功能A的动作时通过效果通过新动作来更新功能B的状态。

让我们举个例子：

功能用户

已调度动作UserActions.Load。
在User减速器中，userState.loading设置为true
UserEffects中的效果，处理UserActions.Load并调度新动作UIActions.ShowNotification。

功能界面

在UI归约器中，uiState.message设置为从...收到的UIActions.ShowNotification(...)
在UIEffects中有一个效果，请处理UIActions.ShowNotification以显示小吃店...

请注意，如果您的功能位于延迟加载的模块中，则此功能将无效。

但是，在使用这种体系结构时要非常小心，以保持代码的可维护性和组织性。有时有必要创建另一个父状态或使用root状态。（与循环依赖关系完全一样）。

否则，请注意，您还可以为多个功能组成选择器，从而避免修改每个状态。（保持真理的单一来源）

export const selectMessage = createSelector(
  selectLoading,  // from UserState feature
  selectMessage,  // from UiState feature
  (loading, message) => {
    return loading ? 'Loading...' : message;
  }
)

访问ngrx中的reducer中的其他状态部分

2 个答案: