Question

我有一个ngrx商店，其初始状态类似于：

const state = { 
    child1: {...},
    child2: {...},
}

具有一个ActionReducerMap，如下所示：

const reducerMap = {
    child1: reducer1,
    child2: reducer2,
}

现在，我想在与child1和child2相同的级别上添加一个“加载”状态，以跟踪两个子项（相互连接）的加载情况。为此，我将初始状态更新如下：

const state = { 
    child1: {...},
    child2: {...},
    loading: false,
}

我试图使用位于reducer1和reducer2顶部的metareducer，如下所示：

export function metaReducer(reducer) {
    return function reduce(state, action) {
        switch(action.type) {
            case CommonActionTypes.UpdateLoading: {
                return {
                    ...,
                    loading: action.loading
                }
            }
            default:
                return reducer(state, action);
        }
    }
}

我将其添加到功能存储中，如下所示：

StoreModule.forFeature('myStore', compose(metaReducer, combineReducers)(reducerMap))

在应用程序中，我在更新child1和child2的某些效果期间调用UpdateLoading操作。但是，这不符合我的预期。

首先，初始状态根本不支持'loading'变量-它仍然认为原始状态为

{ 
    child1: {...},
    child2: {...},
}

状态“ loading”变量仅在调用UpdateLoading操作时才更新。通过所有后续操作，将其从状态中删除。这很奇怪，因为唯一作用在其上的reducer是meta减少器，而reducer1和reducer2分别作用于子状态child1和child2。

使用meta-reducer更新公共状态是否正确？我该如何工作？

Answer 1

在两种情况下都尝试使用reducer功能：

export function metaReducer(reducer) {
    return function reduce(state, action) {
        switch(action.type) {
            case CommonActionTypes.UpdateLoading: {
                return reducer({ // <- wrap it.
                    ...state,
                    loading: action.loading
                }, action);
            }
            default:
                return reducer(state, action);
        }
    }
}

在.forRoot中这样子：

StoreModule.forRoot({/*...*/}, {
  metaReducers: [metaReducer],
}),

Ngrx存储：在ActionReducerMap外部更新公共状态

1 个答案: