使用 NgRx 对状态进行分组不起作用

Question

我正在尝试对状态进行分组。

Index.ts

export const reducers: ActionReducerMap<ApplicationState> = {
  admin: adminReducer
};

export const metaReducers: MetaReducer<ApplicationState>[] = [];

管理员减速器

export const adminReducer: any = {
    productCategory: ProductCategoryReducer,
    productVendor: ProductVendorReducer,
    productSubCategory: ProductSubCategoryReducer,
    products: ProductsReducer,
    product: ProductReducer,
    productDiscount: ProductDiscountReducer
};

当我运行应用程序时，在 redux 工具上，我无法看到状态。空白

export interface ApplicationState {
    admin: AdminState
}

export interface AdminState {
    productCategory: ProductCategoryState;
    productVendor: VendorState;
    productSubCategory: ProductSubCategoryState;
    products: ProductsState;
    product: ProductState;
    productDiscount: ProductDiscountState
}

注册

    imports: [
        
        StoreModule.forRoot(reducers, { metaReducers }),
        EffectsModule.forRoot([]),
StoreDevtoolsModule.instrument({
      maxAge: 25
    })
        
      ]

Answer 1

使用 combineReducers 我实现了

export const adminReducer = combineReducers({
    productCategory: ProductCategoryReducer,
    productVendor: ProductVendorReducer,
    productSubCategory: ProductSubCategoryReducer,
    products: ProductsReducer,
    product: ProductReducer,
    productDiscount: ProductDiscountReducer
});

Answer 2

Reducer 是一个 "函数，它接受一个 Action 和一个 State，以及 returns 一个 State"。 =28=]，不是一个对象，所以你不能仅仅通过创建一个包含它们的对象来将 reducer 彼此分组。

感谢 NgRx combineReducers 函数，它提供了一种组合多个状态的方法，returns 组合 reducer 作为一个函数（用 state & action args) 处理子状态变化和 returns 组合状态。

因此您可以使用 combineReducers 简单地组合减速器，如下所示：

export const adminReducer = combineReducers({ productCategory: ProductCategoryReducer, productVendor: ProductVendorReducer, productSubCategory: ProductSubCategoryReducer, products: ProductsReducer, product: ProductReducer, productDiscount: ProductDiscountReducer, });

使用 NgRx 对状态进行分组不起作用

Grouping the state with NgRx is not working

javascript

angular

typescript

ngrx