Question

假设我有以下状态：

state =  {
  products: {
    50: {
      sku: "000",
      name: "A Product",
      category: 123,
      ...
    }
  },
  categories: {
    123: {
      name: "Some Category",
      parentCategory: 100,
      department: "Electronics"
    }  
  },
  filteredProducts: [50] 
}

我希望能够根据类别过滤产品。但是，我需要根据类别的多个属性进行过滤。即我可能希望获得电子部门的所有类别，或者我可能希望获得一个id为123的类别及其所有子类别。

这是一个人为的例子，与我想要达到的目标非常接近，但它更容易理解，所以请耐心等待。我知道在这个特定的例子中，我可能会使用类似重新选择的东西，但假设我需要对产品减速器进行类别查找，我的选择是什么？

Answer 1

如您所述，您可以使用reselect，并使用参数重选一些选择器，从产品类别中重复使用这些选择器如下：

制作category/selectors文件如下：

import { createSelector } from 'reselect';

const categoriesSelector = state => state.categories;

const selectCategoryById = id => {
  return createSelector(
    categoriesSelector,
    categories => categories[id]
  );
}

const selectCategoryByName = name => {
  return createSelector(
    categoriesSelector,
    categories => categories.filter(c => c.name === name)
  );
}

export default {
  categoriesSelector,
  selectCategoryById,
  selectCategoryByName,
}

同时，在product/selector中，您可以导入类别和产品选择器文件，如下所示：

import { createSelector } from 'reselect';
import { selectCategoryById } from './category/selectors';

const productsSelector = state => state.products;

const selectProductByCategoryId = id => {
  return createSelector(
    productsSelector,
    selectCategoryById,
    (products, categories) => products.filter(p.category.indexOf(id) > -1)
  );
}

export default {
  productsSelector,
  selectProductByCategoryId,
}

在product/reducer中，您可以导入两个选择器并根据类别逻辑返回新的更改状态。

Redux Reducers中的查找

1 个答案: