前端使用elemnt-ui自定义排序

本文介绍了如何在前端使用Element UI的sort-change事件和sortable属性实现Table表格中指定列(如型号和创建时间)的排序。通过监听sort-change事件并在方法中处理排序逻辑,特别是对时间格式的字段进行时间戳转换,以确保正确比较。
摘要由CSDN通过智能技术生成

原创
Element Ui之利用sort-change事件及sortable属性实现Table表格指定列的排序
2019-08-29 17:00:58 杨丫丫 阅读数 707更多
分类专栏: Element Ui
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/yangfan_357/article/details/100140641
表格的表现形式如下:
注意:该实例介绍的为根据“型号”进行排序,或者根据"创建时间"进行排序!!!

具体步骤如下:
1.创建table,绑定data,绑定列名prop,绑定监听事件sort-change

<el-table :data=“tableData” border style=“width: 100%” v-loading=“loading” @sort-change=“changeTableSort”>

{ {scope.$index + 1}}






2.初始化列表数据tableData及加载状态loading

data() {
return {
tableData: [
{
model:2,
modelName:“水浸”,
description:“ccc”,
createTime:“2019-07-17T06:55:14.000+0000”
},
{

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值