javascript - 这是使用 createSelector 组合选择器的正确方法吗？

Question

我想使用 reselectJS 组合选择器，但我的代码看起来与示例中的有点不同，想知道我是否正确使用了该库？

const makeSelectCurrentPosition = () =>
  createSelector(selectGlobal, globalState => globalState.current_position);

const makeSelectSKU = () =>
  createSelector(makeSelectCurrentPosition(), substate => {
    console.log('substate is: ', JSON.stringify(substate));
    return substate.sku;
  });

const makeSelectQualityLabel = () =>
  createSelector(
    makeSelectCurrentPosition(),
    substate => substate.quality_label,
  );

const makeSelectMerchant = () =>
  createSelector(
    makeSelectCurrentPosition(),
    substate => substate.merchant_name,
  );

const makeSelectZRSStatus = () =>
  createSelector(makeSelectCurrentPosition(), substate => substate.zrsStatus);

const makeSelectPositionId = () =>
  createSelector(makeSelectCurrentPosition(), substate => substate.id);

在这个例子中似乎他们没有调用函数而只是提供了 makeSelectCurrentPosition 而不是 makeSelectCurrentPosition() (没有括号)但是当我尝试这个子状态时未定义。

Answer 1

不，你绝对不应该调用输入选择器参数，只是提供选择器功能。createSelector 函数采用可变数量的输入参数 - 除了最后一个之外，所有这些参数都是选择器。最后一个参数总是前面参数的组合。组合器是一个函数，其中输入参数是选择器的评估值(先前的参数)，例如:

// subtotalSelector and taxPercentSelector are other previously defined selectors
const taxSelector = createSelector(
  subtotalSelector,
  taxPercentSelector,
  // subtotal and taxPercent are evaluated values of subtotalSelector and taxPercentSelector
  (subtotal, taxPercent) => subtotal * (taxPercent / 100)
)

// this is another correct syntax for the same example
const taxSelector = createSelector(
  [subtotalSelector, taxPercentSelector],
  (subtotal, taxPercent) => subtotal * (taxPercent / 100)
)

你的下一个选择器的入口点是 reducer 状态和可选的组件 Prop ，在你的例子中我没有看到它。尝试使用 redux 状态创建第一个选择器，例如:

const makeSelectCurrentPosition = (state) => state.current_position;

然后你可以在你的 mapStateToProps 中使用它(如果你使用的是 react-redux)，这样:

mapStateToProps = state => {
  selectCurrentPosition: makeSelectCurrentPosition(state)
}