Redux / Reselect - 选择器重用答案

【问题标题】：Redux / Reselect - selector reusingRedux / Reselect - 选择器重用
【发布时间】：2017-04-14 11:57:53
【问题描述】：

我是选择器的新手。我创建了以下这些：

import { createSelector } from 'reselect';

const getValues = (state) => state.grid; // [3, 4, 7, 3, 2, 7, 3,...]
const getTiles = (state) => state.tiles; // [0, 1, 0, 1, 0, 0, 1,...]

// counts selected tiles (ie. adds up all the 1s)
export const getSelected = createSelector(
  [getTiles],
  tiles => tiles.reduce((acc, elem) => acc + elem, 0)
);

// displays only values of selected tiles, for the rest it shows 0
export const showSelected = createSelector(
  [getTiles, getValues],
  (tiles, grid) => tiles.map((idx, i) => (idx === 1 ? grid[i] : 0))
);



  export const addSelected = createSelector(
  [showSelected]
  .....
);

/*
export const addSelected = createSelector(
  [showSelected],
  coun => coun.reduce((acc, elem) => acc + elem, 0)
);

*/

第三个选择器（addSelected - 最后一个底部，注释掉的版本）与第一个选择器基本相同（输入不同）。我怎样才能使它更通用，以便我可以重用它而不是再次编写整个 'reduce' 行？

【问题讨论】：

标签： redux reselect

【解决方案1】：

您可以像这样将 reduce 部分提取到它自己的函数中：

import { createSelector } from 'reselect'

...

// addElements adds all elements from given array
const addElements = elements =>
  elements.reduce((acc, elem) => acc + elem, 0)

export const getSelected = createSelector([getTiles], addElements)

export const addSelected = createSelector([showSelected], addElements)

我希望这会有所帮助。

【讨论】：