`el-table` 是 Element UI 中的一个表格组件,它提供了一种方便的方式来展示数据,并支持内置的排序功能。默认情况下,当用户点击表头某一列时,`el-table` 会按照该列的值进行升序排列。如果需要降序排列,可以在列定义的 `sortable` 属性上设置为 `true` 并且传入一个函数作为排序策略。
例如:
```html
<el-table :data="tableData" @sort-change="handleSortChange">
<el-table-column prop="name" label="姓名" sortable>
</el-table-column>
<!-- 其他列... -->
</el-table>
<script>
export default {
methods: {
handleSortChange(column) {
this.tableData.sort((a, b) => {
if (column.order === 'ascend') {
return a[column.prop] > b[column.prop] ? 1 : -1;
} else {
return a[column.prop] < b[column.prop] ? 1 : -1;
}
});
},
},
};
</script>
```
本文地址:http://ww.kub2b.com/tnews/3718.html
企库往 http://ww.kub2b.com/ , 查看更多