我有一个带有排序标题表的React组件。此代码按计划工作:

  //definitions and imports...
  const [sort, setSort] = useState({column: 'rank', direction: 'ascending', isNumber: true});

  const handleSort = (column, isNumber = false) => () => {
    let direction = (sort.column !== column) ? 'ascending' : (sort.direction === 'ascending' ? 'descending' : 'ascending');
    setSort({column, direction, isNumber});
  };

  const getSortedData = (data) => {
    let sorted = R.sortBy(
      R.compose(
        sort.isNumber ? Number.parseFloat : R.toLower,
        R.prop(sort.column)
      ),
      data
    );
    return sort.direction === 'ascending' ? sorted : sorted.reverse();
  }
 //rest of the component...


但是,我确定有一种方法可以使用R.compose有条件地ascenddescend排序(基于sort.direction属性),从而允许我删除getSortedData的最后一行,并删除reverse阵列运算。

我尝试了几件事(例如用ascend组成prop,在compose中使用条件等),但是这一切都破坏了代码。

虽然现在效果很好,但是有人可以帮助我提高它的质量吗?

更新-为子孙后代在此处添加解决方案:

const getSortedData = (data) => {
  return R.sort(
    (sort.direction === 'ascending' ? R.ascend : R.descend)(
      R.compose(
        sort.isNumber ? Number.parseFloat : R.toLower,
        R.prop(sort.column)
      )
    )
  )(data);
}


我学到的东西:


Ramda返回一个函数,而不是一个数组,因此您需要将R.sort作为参数发送给整个函数。
data / R.ascend也希望该函数用作参数,因此不应单独作为R.descend的参数。

最佳答案

我想我会做这样的事情,将ascenddescend包裹在合成物周围:



const makeSorter = (sortConfig) => R.sort (
  (sortConfig.direction === 'descending' ? R.descend : R.ascend) ( R.compose (
    sortConfig.isNumber ? Number.parseFloat : R.toLower,
    R.prop (sortConfig.column)
  ))
)

const people = [
  {name: 'fred', age: 25},
  {name: 'barney', age: 28},
  {name: 'wilma', age: 29},
  {name: 'betty', age: 22}
]

const byName = {direction: 'descending', column: 'name', isNumber: false}

const getSortedData = makeSorter(byName)

console .log (
  getSortedData (people)
)

const byAge = {direction: 'ascending', column: 'age', isNumber: true}

console .log (
  makeSorter (byAge) (people)
)

<script src="//cdnjs.cloudflare.com/ajax/libs/ramda/0.26.1/ramda.js"></script>





我个人更喜欢使用解构来编写它,例如:

const makeSorter = ({direction, isNumber, column}) => R.sort (
  (direction === 'descending' ? R.descend : R.ascend) ( R.compose (
    isNumber ? Number.parseFloat : R.toLower,
    R.prop (column)
  ))
)


但这并没有改变任何基本面。

关于javascript - 如何在Ramda中组成升序/降序,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/56463740/

10-11 12:38