直接上代码
1、表格定义
<el-table ref="tableRef" :data="tableData" style="width: 100%">
<!-- 省略表头等内容 -->
<el-table-column prop="id" label="ID"></el-table-column>
<el-table-column prop="name" label="名称"></el-table-column>
<el-table-column prop="age" label="年龄"></el-table-column>
<el-table-column prop="gender" label="性别"></el-table-column>
</el-table>
2、js文章来源：https://www.toymoban.com/news/detail-832216.html
import { ref, nextTick } from 'vue'
<script>
export default {
data(){
return{
tableData: []
}
},
methods:{
getData(){
// axios加载数据，略
this.tableData = response.data;
// 加载完成后再排序
nextTick(()=>{
this.$refs.tableRef.sort('id', 'descending'); //逆序
})
}
},
mounted() {
this.getData();
}
}
</script>
参考：
https://element-plus.org/zh-CN/component/table.html#table-%E5%B1%9E%E6%80%A7
https://www.cnblogs.com/onesea/p/15702253.html文章来源地址https://www.toymoban.com/news/detail-832216.html
到了这里，关于Vue3-element-plus表格中动态加载数据后再进行列排序的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
