Question

当我从ngrx使用带有store.select（）的重新选择时，我正试图绕过引擎盖下的内容。

我知道select（）方法希望您从要返回的状态返回该片段。例如：

store.select(state => state.articles.isLoading);

使用Reselect，它将类似于：

// articles.reducer
const getIsLoading = state => state.isLoading

// root.ts
const getArticlesState = state => state.articles;
const getIsLoading = createSelector(getArticlesState, fromArticles.getIsLoading)

//component.ts
store.select(fromRoot.getIsLoading)

我试图了解最后一块中发生的事情：

store.select(fromRoot.getIsLoading)

fromRoot.getIsLoading会返回一个值还是一个函数？

Answer 1

来自reselect documentation：

选择器效率很高。除非其参数之一改变
，否则不会重新计算选择器

另外，您应该阅读：https://github.com/reactjs/reselect#motivation-for-memoized-selectors

尽管如此，reselect在内部使用了一个名为memoization的进程。所以发生的事情是它保存了选择器的输出，并且每次触发选择器时，它都会检查传递给选择器的参数是否相同，如果是，reselect只返回缓存的结果，而不是通过再次计算您的数据。

这就是为什么这个lib非常有趣，如果你规范化你的数据然后需要用选择器来组合它们。

此外，由于您的选择器组成的数组/对象在reselect返回缓存值时不会更改其引用，因此Angular可以使用该信息并避免触发重绘。当然，这比在您的商店更新时重新绘制所有内容更快。

Answer 2

selector getIsLoading返回一个值。它的价值来自于那个重要的价值。

选择器保持缓存它返回的最后一个值。此外，它会跟踪存储的切片是否为其转换函数的参数发生了变化。

如果商店发生变化，它将重新运行转换功能，缓存它获得的值并将其返回。

如果商店没有变化，它将直接返回缓存值。

Angular ngrx商店了解Reselect的返回值

2 个答案: