将 props 直接传递给实用函数

Question

我有以下常用的排序功能，export const sortSelectOptions = (options, sortByKey = 'name', type) => {  switch (type) {    case 'alphaNumeric':      return options        .slice()        .sort((a, b) =>          Math.sign(            parseInt(a.name.replace(/["]$/, ''), 10) -            parseInt(b.name.replace(/["]$/, ''), 10)          )        );    case 'numeric':      return options.slice().sort((a, b) => (a.nominalSize > b.nominalSize ? 1 : -1));    default:      return sortBy(options, sortByKey)  }}我正在调用上面的函数，如下所示，options => sortSelectOptions(options, null, 'numeric')对于数字类型，我基于排序nominalSize，现在我想直接从这里传递这个字段sortSelectOptions(options, null, 'numeric')作为道具。选项是对象数组，其中一个属性是nominalSize。我正在寻找一种通用的排序功能。任何人都可以让我知道如何将精确字段作为道具传递给通用函数以实现排序功能。提前谢谢了

Answer 1

如果我理解正确的话，您希望访问值的逻辑在排序函数之外进行排序？

您可以通过名称访问属性，如下所示：

export const sortSelectOptions = (options, sortByKey = 'name', type, fieldName) => {

  switch (type) {

    case 'alphaNumeric':

      return options

        .slice()

        .sort((a, b) =>

          Math.sign(

            parseInt(a.name.replace(/["]$/, ''), 10) -

            parseInt(b.name.replace(/["]$/, ''), 10)

          )

        );

    case 'numeric':

      return options.slice().sort((a, b) => (a[fieldName] > b[fieldName] ? 1 : -1));

    default:

      return sortBy(options, sortByKey)

  }

}

并用以下方式调用它：

options => sortSelectOptions(options, null, 'numeric', 'nominalSize')

或者您可以概括此模式并请求访问器函数，如下所示：

export const sortSelectOptions = (options, sortByKey = 'name', type, accessor) => {

  switch (type) {

    case 'alphaNumeric':

      return options

        .slice()

        .sort((a, b) =>

          Math.sign(

            parseInt(accessor(a).replace(/["]$/, ''), 10) -

            parseInt(accessor(b).replace(/["]$/, ''), 10)

          )

        );

    case 'numeric':

      return options.slice().sort((a, b) => (accessor(a) > accessor(b) ? 1 : -1));

    default:

      return sortBy(options, sortByKey)

  }

}

并用以下方式调用它：

options => sortSelectOptions(options, null, 'numeric', x => x.nominalSize)

options => sortSelectOptions(options, null, 'alphaNumeric', x => x.name)

后一个版本还允许您访问深度嵌套的属性。

Answer 2

您可以像这样传递道具名称：

export const sortSelectOptions = (options, sortByKey = 'name', type, prop) => {

    //...

    return options.slice().sort((a, b) => (a[prop] > b[prop] ? 1 : -1));

    //...

}