表格内容

根据票据日期升序(这里是已经排序后的效果)

上代码

代码中data的内容如下

根据paper_date排序,因为目前这种格式不支持比较,需要先转换成时间戳

new Date(aTimeString).getTime()

之后再用装换后的时间戳去比较,比较用到的函数是 .sort,一下是用来比较的代码

data.sort(function(a, b) {

let aTimeString = a.paper_date;

let bTimeString = b.paper_date;

let aTime = new Date(aTimeString).getTime();

let bTime = new Date(bTimeString).getTime();

return aTime - bTime;

});

附:知识用来记录自己遇到的问题解决方法,大神勿喷

补充知识:antd的Table后端排序(列升降序)的坑

antd Table列升降序需要有个sorter属性

由于分页是后端分页,因此,排序也必须用后端排序(因为前端获取到的数据只有一页,无法正确排序)

sorter: (a, b) => { // 啥也不写,不需要前端排序,写了sorter才会出现排序图标},

这里会碰到一个坑,接口请求回来的数据明明已经排序正确了,传给dataSource也是正常的,为什么渲染出来的是错的? 因为前端又不完整的自行排序了一次

这时候sorter就不该写成回调函数形式,而应该写成sorter: true

const columns = [{

title: 'Name',

dataIndex: 'name',

filters: [{

text: 'Joe',

value: 'Joe',

}, {

text: 'Jim',

value: 'Jim',

}, {

text: 'Submenu',

value: 'Submenu',

children: [{

text: 'Green',

value: 'Green',

}, {

text: 'Black',

value: 'Black',

}],

}],

// specify the condition of filtering result

// here is that finding the name started with `value`

onFilter: (value, record) => record.name.indexOf(value) === 0,

// sorter: (a, b) => a.name.length - b.name.length,

sorter: true,

}]

那回调不写,我应该在哪里发送后端排序请求呢?

rowKey='projId'

size="small"

style={{ height: tableHeight }}

columns={columns}

tableData={this.state.tableData}

expandedRowRender={this.expandedRowRender}

pagination={pagination}

handleTableChange={this.handleTableChange} // 在这里发送请求 处理后端排序

scroll={{ y: tableScrollHeight, x: 1660 }}

tableRowSelection={this.tableRowSelection}

/>

以上这篇antd table按表格里的日期去排序操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

antd table 排序如何使用_antd table按表格里的日期去排序操作相关推荐

  1. antd table 时间搜索_antd table按表格里的日期去排序操作

    表格内容 根据票据日期升序(这里是已经排序后的效果) 上代码 代码中data的内容如下 根据paper_date排序,因为目前这种格式不支持比较,需要先转换成时间戳 new Date(aTimeStr ...

  2. antd table 排序如何使用_Antd Table列字符串排序+数字排序

    在中后端WEB app开发过程中经常遇到table列排序的问题,Antd table 提供了sorter的接口,我们可以根据各自项目特点拓展即可. 1.Number类型数据排序,官方提供了number ...

  3. matplotlib的table详细使用、使用matplotlib绘制表格

    matplotlib之table详细使用.使用matplotlib绘制表格 参数解释详情 表格一般通常和其他图组合使用 cellText:表格的数值,将源数据按照行进行分组,每组数据放在列表里存储,所 ...

  4. antd table排序 vue_ant-design-vue中的table取消默认不排序的状态

    ant-design-vue中的table组件具有排序的属性,该排序属性有三种状态:升序.降序和不排序.在项目开发中,有时产品经理会要求排序时只能有升序或降序两种状态,而table组件中却没有相应的A ...

  5. (十八)Flink Table API SQL 编程指南 Table API 和Datastream API 集成

    文章目录 DataStream 和 Table 之间的转换 依赖项和导入 配置 执行行为 datastream API table API 批处理运行时模式 Changelog统一 处理(仅插入)流 ...

  6. html table表头升序 降序,jquery实现表格根据字段进行升序降序

    例子: 蚂蚁部落 * { margin: 0; padding: 0; } body { padding: 100px; } .select { position: relative; display ...

  7. Hive 的概念、应用场景、安装部署及使用、数据存储 、table(内部表)和external table(外部表)、partition(分区表)和bucket(分桶表)

    目录 1.Hive 的概念 2.Hive 的特点 3.Hive 和 RDBMS(关系型数据库) 的对比 4.Hive 和 HBase 的差别 5.Hive 架构 6.Hive安装与使用方法介绍 7.H ...

  8. R语言data.table导入数据实战:data.table中编写函数并使用SD数据对象

    R语言data.table导入数据实战:data.table中编写函数并使用SD数据对象 目录 R语言data.table导入数据实战:data.table中编写函数并使用SD数据对象 #data.t ...

  9. R语言data.table导入数据实战:data.table使用by函数进行数据分组(aggregate)

    R语言data.table导入数据实战:data.table使用by函数进行数据分组(aggregate) 目录 R语言data.table导入数据实战:data.table使用by函数进行数据分组( ...

最新文章

  1. 一个 Mybatis 开发神器:Fast MyBatis 超好用
  2. 为什么不建议在 MySQL 中使用 UTF-8?
  3. C语言实现二进制文件读写
  4. LeetCode 中等难度 92. 反转链表 II解题思路
  5. 多变量线性回归 原理
  6. python获取一个月之前日期_Python 获取几天前的时间
  7. 微软官宣:史上最贵开发工具 75亿美金收购GitHub
  8. flowable流程实例笔记(1)
  9. spring cloud微服务分布式云架构-Spring Cloud 分布式的五大重点
  10. 1016 部分A+B (15 分)—PAT (Basic Level) Practice (中文)
  11. html中怎么让照片变模糊,CSS改变图片由模糊到清晰
  12. 学生用计算机怎么恢复出厂设置,电脑怎么恢复出厂设置
  13. 怎么删除服务器的ibd文件,mysql数据库ibd文件
  14. java生成随机的26位英文字母
  15. 子组件调用父组件中方法的方法
  16. 将千克转换成磅 Exercise05_03
  17. 多元线性回归分析练习题
  18. Linux/Centos: 服务器TIME_WAIT和CLOSE_WAIT区别及解决方案
  19. LabVIEW程序框图保存为图像
  20. mysql 创建触发器(for each row解释)

热门文章

  1. uwsgi php,Nginx+Django+Uwsgi+php
  2. 那些年我们在一线背锅的日子- 运维经理手记
  3. vegas界面对比!
  4. linux命令deploy_Linux 命令每天必学(34)之du命令
  5. axios二次封装以及API接口统一管理
  6. ubuntu 14.04 下 启用thinpad指点杆
  7. 矩阵快速幂详解--用矩阵幂解决的多种问题
  8. 访日本Marza团队:Unity引擎制作VR动画实践
  9. JavaScript——异步编程
  10. 理光Ricoh Aficio 350 一体机驱动