el-table遇上排序直接失灵了？el-table遇上排序直接失灵了？今天遇到一个神奇的问题，我们的需求是对表格排序

今天遇到一个神奇的问题，我们的需求是对表格排序，排序是后端排序，前端只需要传入排序字段，和排序方式，结果发现一个问题，表格渲染出来的和后端返回的数据不一致，已开始以为是表格更新的问题，排查了很久发现是我的自定义排序的问题

el-table的自定义排序

如果你想要自定义排序，需要做两个事情：

配置sort-change

<el-table :data="prop.tableData" style="width: 100%" row-key="plateNumber" border @sort-change="handleListSortChange">

const handleListSortChange = (props) => {
    const { order, prop = '' } = props
    searchForm.sort = order === 'ascending' ? 0 : 1
    searchForm.sortCondition = prop.toUpperCase()
    getVehiclesList()
}

一定要配置列的 sortable="custom" ，如果没有设置custom的话，他表格内部还是会按照他内部的排序，这个时候会导致你的后端排序无效的问题

 <el-table-column  sortable="custom" width="150" />

总结

还是要多看官方文档，我是看之前的代码中是直接写了个@sort-change ，没注意列上面的sortable的值，所以出现这个bug，一开始一直从数据方向找问题。