在实际开发工作中,经常会遇到需要排序的情况,前端排序可直接利用el-table的sortable属性,后台排序需要自定义排序方法,如下:
<el-table
ref="multipleTable"
:data="tableData"
tooltip-effect="dark"
style="width: 100%"
@sort-change='handleSort' // 监听sort-change,自定义排序事件
border
>
<el-table-column
prop="name"
label="用户名称"
sortable='custom' // 必须设置,将需要排序的列上设置sortable为custom
>
</el-table-column>
<el-table-column
prop="age"
label="年龄"
>
</el-table-column>
</el-table>
handleSort({column,order}) {
console.log(order) // 升序还是降序
console.log(column) // 排序相关属性
// 在此处调用接口即可
}