elementui实现表格自定义排序

在Element UI中，可以通过给<el-table-column>组件的sortable属性设置为custom来实现自定义排序。然后监听表格的sort-change事件来处理自定义排序的逻辑。

以下是一个简单的例子：

<template>
  <el-table
    :data="tableData"
    @sort-change="handleSortChange">
    <el-table-column
      prop="date"
      label="日期"
      sortable="custom">
    </el-table-column>
    <el-table-column
      prop="name"
      label="姓名"
      sortable="custom">
    </el-table-column>
    <el-table-column
      prop="address"
      label="地址"
      sortable="custom">
    </el-table-column>
  </el-table>
</template>
 
<script>
export default {
  data() {
    return {
      tableData: [{
        date: '2016-05-02',
        name: '王小虎',
        address: '上海市普陀区金沙江路 1518 弄'
      }, /* ... more data ... */]
    }
  },
  methods: {
    handleSortChange({ column, prop, order }) {
      console.log(`Sorting by ${prop} ${order}`);
      // 在这里实现自定义排序逻辑
      // 例如，可以对 this.tableData 进行排序处理
      // 如果使用了第三方库如 lodash，可以使用 _.orderBy 方法
      // this.tableData = _.orderBy(this.tableData, [prop], [order.toLowerCase()]);
    }
  }
}
</script>

在handleSortChange方法中，你可以实现自定义的排序逻辑。你可以直接修改tableData数组，或者请求新的数据从服务器获取。注意，Element UI不会自动更新表格数据，你需要手动根据排序结果更新tableData。