首页 > 解决方案 > 从商店的多个切片中获取 NGRX 数据的最佳方式是什么

问题描述

是否有从 NGRX 存储的多个切片中获取数据的最佳实践?我正在使用 NGRX 实体,我对公司、用户、供应商和订单有一个切片,在一个特定的组件中,我需要访问所有 4 个。我尝试了几种不同的方法,但它们看起来都很麻烦。

我应该使用来自多个实体的 4 个单独的选择器,还是最好在根级别创建一个选择器并包含详细信息页面所需的所有内容?

目前,我正在使用combineLatest操作员

this.subscription.add(this.store.select(fromUser.getUsers).pipe(
    combineLatest([
        this.store.select(fromCompanies.selectAll),
        this.store.select(fromVendors.selectAll),
        this.store.select(fromOrders.getOrders),
    ]))

标签: angularrxjsngrx

解决方案


我发现组合选择器的最佳方式是使用选择器,这也是最高效的方式,因为 NgRx 在这里做了一些优化。

AcreateSelector可以由多个选择器组成,在您的情况下,这将是:

export const foo = createSelector(
  fromUser.getUsers,
  fromCompanies.selectAll,
  fromVendors.selectAll,
  fromOrders.getOrders,
  (users, companies, vendors, orders) => {
     // logic here
  }
)

有关更多信息,请参阅在模块之间共享数据是花生


推荐阅读