微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

react-bootstrap-table-2 sortFunc永远不会被调用

如何解决react-bootstrap-table-2 sortFunc永远不会被调用

我正在尝试为表的某一列(日期格式)自定义排序功能。根据文档,使用sortFunc可以做到这一点很简单,但是由于某些原因它不起作用。

列定义:

{
  datafield: "dateOfBirth",text: "Date of birth",sort: true,sortCaret: sortCaret,//custom sorting function to parse dates
  sortFunc: (a,b,order,datafield,rowA,rowB) => {
    console.log("Sorting dates");
    if (order === 'asc') return a - b;
    else return b - a;
  },headerSortingClasses,},

我知道sort函数尚不能解析日期,但是甚至没有调用它(我没有任何控制台输出)。

表定义:

<BootstrapTable
   wrapperClasses="table-responsive"
   bordered={false}
   classes="table table-head-custom table-vertical-center overflow-hidden"
   bootstrap4
   remote
   keyField="id"
   data={entities === null ? [] : entities}
   columns={columns}
   defaultSorted={uiHelpers.defaultSorted}
   onTableChange={getHandlerTableChange(
     patientsUIProps.setQueryParams
   )}
   {...paginationTableProps}
>

这是什么问题?

解决方法

我根据您的代码https://codesandbox.io/s/react-bootstrap-table-next-basic-example-forked-h5pn0?file=/src/index.js

整理了一个简单的示例 如果单击“出生日期”列,则会调用

sortFunc,您可以看到控制台输出。如果您希望在开始时完成此操作,则需要将defaultSorted更改为:

defaultSorted={[{ dataField: "dateOfBirth",order: "desc" }]}

order由您决定,但必须进行设置。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。