时间戳

首页 > 解决方案 > 在 NGRX 中合并两个减速器

typescript - 在 NGRX 中合并两个减速器

问题描述

我正在使用@ngrx@9.2.0，并且我有一个在工厂中创建的reducer，因为它对于我的项目中的多个实体是相同的。

function createEntityReducer(initialState, actions) {
  const reducer = createReducer(
    initialState,
    on(actions.loadAll.success, (state, action) => {
      ...
    })
  ); 
  return reducer;
}

const generalReducer = createEntityReducer(initialState, actions);

但我想为某个实体的特定操作扩展这个基本的减速器。

const specificReducer = createReducer(
        initialState,
        on(actions.loadChildren.success, (state, action) => {
          ...
        })
      );

如何合并两个减速器，而不必像这样创建嵌套功能？

const reducer = mergeReducers(generalReducer, specificReducer);

标签： typescriptreduxngrxngrx-store

解决方案

在检查了@ngrx/store/createReducer函数的工作原理后，我编写了以下似乎可以正常工作的内容。

function mergeReducers<TState>(
  ...reducers: ActionReducer<TState, Action>[]
): ActionReducer<TState, Action> {
  const mergedReducers = (
    state: TState | undefined,
    action: Action
  ): TState => {
    if (reducers.length === 0) {
      throw new Error('At least one reducer was expected');
    }
    const newState = reducers.reduce((initialState, reducer) => {
      const intermediaryState = reducer(initialState, action);
      return intermediaryState;
    }, state);

    return newState as TState;
  };
  return mergedReducers;
}

推荐阅读