2

按照重新选择文档上的示例：

import { createSelector } from 'reselect'

const shopItemsSelector = state => state.shop.items

const subtotalSelector = createSelector(
  shopItemsSelector,
  items => items.reduce((acc, item) => acc + item.value, 0)
)

在典型的 redux 应用程序中，subtotalSelector如果用户更新，将重新计算item.name，即使这对结果没有影响。有没有办法避免这种情况？

4

2 回答 2

1

两种解决方案：

  1. 随它去。除非您有大量项目，否则浏览器的计算能力足以处理重新计算。

  2. 将价格与项目对象分开。也就是说，您有state.shop.items.itemNames（包含 id-name 对）和state.shop.items.itemValues（包含 id-value 对）。然后只有itemValues被传递给选择器。

于 2016-12-23T02:31:58.823 回答
0

我有一个类似的问题，我找到了一种解决方法。

我有一组复杂的过滤器，以及大量要过滤的项目。部分过滤器状态包括显示状态。我想忽略显示状态的变化，所以我不会一直过滤一个巨大的列表。这是一个简单的解决方案：

const getFilters = createSelector(
    state => state.filters,
    filters => {
        const filtersWithoutDisplay = {};
        const ignoreObj = { collapsed: null };
        for (let filterGroup in filters) {
            filtersWithoutDisplay[filterGroup] = Object.assign({}, filters[filterGroup], ignoreObj);
        }
        // We create a new object every time, so this cannot be memoized properly unless we stringify.
        return JSON.stringify(filtersWithoutDisplay);
    }
);

它返回一个必须解析的 JSON 字符串，但它是一个原语，因此作为另一个选择器的输入，如果实际内容没有改变，它不会触发重新计算。这是一种黑客行为。

您还可以在选择器函数之外定义一个对象并始终保持相同的引用，根据相同的模式更改内部，然后通过拉入来使用自定义深度相等检查createSelectorCreator，如此处所述https://github.com/ reactjs/reselect#q-why-is-my-selector-recomputing-when-the-input-state-stays-the-same。这可能是一个更好的方法，但正如它所说：

始终检查状态更新函数中替代equalCheck函数或深度相等检查的成本不大于每次重新计算的成本。

这也适用于 JSON.stringify hack。对于庞大的列表，我不会这样做，但对于过滤器，当然。

在我的情况下，重构我的状态可能会更好，因为过滤器值可能与过滤器显示设置不同，这可能不是我唯一一次希望它们分开。

于 2017-05-25T00:35:36.677 回答