从商店的多个切片获取 NGRX 数据的最佳方法是什么?

Question

是否有从 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),
]))

Answer 1

我发现组合选择器的最佳方法是使用选择器，这也是性能最高的方法，因为 NgRx 在这里进行了一些优化。

一个createSelector可以由多个选择器组成，在您的情况下，这将是：

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

有关详细信息，请参阅在模块之间共享数据是花生