前端实现

1. 在表格上加监听函数@sort-change。如下红框所示：

2. 在表行上加排序字:sort-orders，可排序字sortable。如下红框所示：

3. 添加监听函数实现。代码如下：

handleSortChange(column) {this.queryParams.orderByColumn = column.prop;//查询字段是表格中字段名字this.queryParams.isAsc = column.order;//动态取值排序顺序this.getList();}

完整代码如下：.

<el-table v-loading="loading" :data="liquid_heightList" @selection-change="handleSelectionChange" @sort-change="handleSortChange"><el-table-column type="selection" width="55" align="center" /><el-table-column label="时间" align="center" prop="dateTime" width="95" :sort-orders="['descending','ascending']" sortable="custom"><template slot-scope="scope"><span>{{ parseTime(scope.row.dateTime, '{h}:{i}:{s}') }}</span></template></el-table-column></el-table>method:{//排序，倒序handleSortChange(column) {this.queryParams.orderByColumn = column.prop;//查询字段是表格中字段名字this.queryParams.isAsc = column.order;//动态取值排序顺序this.getList();}
}

后端实现

只需在对应的xml文件中的selectXXList里面加上参数解析即可，如下本文展示的案例，是在selectLiquidHeightList中添加方法。

以上步骤操作到这，就实现了数据列表的倒序排序了。重新启动服务就可以看到实际效果了：