1、(a, b) => { return a.total_money - b.total_money; }
a-b>0表示a大于b;
a-b=0表示a等于b;
a-b<0表示a小于b;
- <el-table-column
- prop="total_money"
- label="支付金额(元)"
- width="180"
- sortable
- :sort-method="(a, b) => { return a.total_money - b.total_money; }">
- el-table-column>
2、如果需要后端排序,需将sortable
设置为custom
,同时在 Table 上监听
sort-change
事件,在事件回调中可以获取当前排序的字段名和排序顺序,从而向接口请求排序后的表格数据。
- <el-table
- :data="tableData"
- style="width: 100%"
- :default-sort = "{prop: 'date', order: 'descending'}" @sort-change="change">
- <el-table-column
- prop="date"
- label="日期"
- sortable="sortable"
- width="180">
- el-table-column>
- <el-table-column
- prop="address"
- label="地址"
- :formatter="formatter">
- el-table-column>
- el-table>
- var Main = {
- data() {
- return {
- tableData: [{
- date: '2016-05-02',
- name: '王小虎',
- address: '上海市普陀区金沙江路 1518 弄'
- }, {
- date: '2016-05-04',
- name: '王小虎',
- address: '上海市普陀区金沙江路 1517 弄'
- }, {
- date: '2016-05-01',
- name: '王小虎',
- address: '上海市普陀区金沙江路 1519 弄'
- }]
- }
- },
- methods: {
- change(res,s){
- console.log(res)
- console.log("---",res.order)
- },
- formatter(row, column) {
- return row.address;
- }
- }
- }
评论记录:
回复评论: