vue+elementui 项目 table表格自定义排序规则
官方解释：
在列中设置 sortable 属性即可实现以该列为基准的排序，接受一个 Boolean，默认为 false。可以通过 Table 的 default-sort 属性设置默认的排序列和排序顺序。可以使用 sort-method 或者 sort-by 使用自定义的排序规则。如果需要后端排序，需将 sortable 设置为 custom，同时在 Table 上监听 sort-change 事件，在事件回调中可以获取当前排序的字段名和排序顺序，从而向接口请求排序后的表格数据。
其实前端排序要使用自定义排序规则也可以将 table 的 el-table-column 标签上 sortable 属性设置为 custom，要不然在排序一些特殊内容的时候就会出现乱象，比如：排序的列都是下拉列表的时候，就会出现乱象问题
<el-table-column:label="tableItemConfig.label":min-width="tableItemConfig.width"align="center":prop="tableItemConfig.prop"sortable="custom">
在 el-table 标签上绑定sort-change事件
<el-tableref="table":data="tablePageData":show-header="tableConfig.isShowHeader ? tableConfig.isShowHeader : true":border="tableConfig.isShowBorder":style="tableConfig.tableStyle":header-cell-style="tableConfig.headerCellStyle":row-style="tableRowStyle"@sort-change="sort_change">
methods: {sort_change(column) {this.tablePageData= this.tablePageData.sort(sortFun(column.prop, this.searchDataOrder))},// attr 参数表示当前点击的是哪一列，传进来的是点击列的标识// rev 参数表示的是点击当前列表头之后是升序降序或者null，三种值分别是['ascending', 'descending', null]sortFun = (attr, rev) => {if(rev === 'ascending') {rev = 1} else if (rev === 'descending') {rev = -1} else {rev = 0}return function (x, y) {let a = x[attr]let b = y[attr]if (!a) {a = ""}if (!b) {b = ""}if (a < b) {return rev * -1}if (a > b) {return rev * 1}return 0}}}
