如何按日期排序表格数据实现最新注册数据置顶(createdAt为字符串类型)
这是我的数据表:
当前表格里最旧的注册日期排在最上方,要实现最新日期的数据置顶,首先排查现有代码的问题:
现有代码的核心问题
- 代码第一行直接赋值
this.dataSource = [];,相当于先把原数据源全部清空,后续排序操作作用在空数组上,根本处理不到真实的业务数据。 - 现有比较逻辑是升序规则,字符串值更小的(对应更早的日期)会被排在数组最前面,刚好和“最新数据置顶”的需求方向相反。
- 直接对字符串类型的
createdAt做大小比较,只有字符串是严格ISO 8601格式(以YYYY-MM-DD开头)时结果才准确,一旦遇到MM/DD/YYYY、DD-MM-YYYY这类格式的日期字符串,按字典序比较的结果会完全偏差,必须把日期转成可计算的时间戳再比较。
修正后的可运行代码
// 先拷贝原始数据源,不要主动清空原有数据 const originalList = [...this.dataSource]; this.dataSource = originalList.sort((a, b) => { // 把字符串格式的日期解析为毫秒时间戳,规避格式差异导致的比较错误 const timeA = Date.parse(a.createdAt); const timeB = Date.parse(b.createdAt); // 降序排列:时间戳越大代表日期越新,对应记录排在数组越靠前的位置 return timeB - timeA; });
注意事项
- 如果后端返回的
createdAt是自定义非标准格式(比如YYYY年MM月DD日这类特殊写法),且Date.parse无法准确解析,可以先拆分字符串提取年、月、日、时分秒的数值,传入new Date()生成标准时间对象后再取时间戳比较。 - 不需要写多分支的if判断,直接返回两个时间戳的差值作为sort的比较结果,代码更简洁,也能避免手写判断时的方向错误。
内容的提问来源于stack exchange,提问作者Rence Sacramento
相关产品推荐
相关产品推荐

