时间戳

首页 > 解决方案 > 根据传递给单元格的属性对列进行排序

javascript - 根据传递给单元格的属性对列进行排序

问题描述

        Header: "Votes",
        accessor: "Voter",
        filterable: false,
        Cell: row => <Voter id={row.index} vote={this.filterCount(row.index)} />,
        sortMethod: null //sort based on vote prop passed above ^

我希望我的表格根据我传递给单元格中 Voter 组件的属性的最大值进行排序。除了我传递给sortMethod访问我的 JSON 文件中的数据的任何值，但我需要使用我在组件中提取的数据。有办法吗？任何帮助深表感谢

标签： javascriptreactjsreact-table

解决方案

假设您使用的是 react-table （您已将其添加为标签），可以为 sort 方法提供一个以 2 个值作为参数的函数）：

sortMethod: (a, b) => {
            a = (a === null || a === undefined || a === '') ? -Infinity : a;
            b = (b === null || b === undefined || b === '') ? -Infinity : b;

            a = parseInt(a);
            b = parseInt(b);
            if (a === b) {
              return 0;
            }
            return a > b ? 1 : -1;
          }

排序方法应该像 javascript 类型使用的普通排序方法一样工作。这是一个非常基本的排序方法，它简单地按整数值排序，如果 b 更高，则将 a 排序，并处理未定义变量的任何边缘情况，将它们推到底部。

它有点抽象，这足以告诉它如何对 2 个项目进行排序，它将应用于所有行。这些值不必命名A，B而且更简单。A 和 B 都代表 2 个单元格值。如果您的单元格值是一个对象，而不是整数，那么 A 和 B 也是对象，您应该使用要比较的值。例如，如果您的单元格值是对象，并且您想根据 voter_id 进行排序，您可以这样做：

return a.voter_id > b.voter_id ? 1 : -1;

代替

return a > b ? 1 : -1;

推荐阅读