四种el-table的配置排序方式

一:sortable="custom" 和 @sort-change="sortChange"

如果需要后端排序,需将sortable设置为custom,同时在 Table

上监听sort-change事件,在事件回调中可以获取当前排序的字段名和排序顺序,从而向接口请求排序后的表格数据。

二::default-sort="{prop: 'salesVolume', order: 'descending'}"

通过 Table 的default-sort属性设置默认的排序列和排序顺序

三::sort-orders="'descending','ascending'"

传入一个数组,随着用户点击表头,该列依次按照数组中元素的顺序进行排序。数组中的元素需为以下三者之一:ascending表示升序,descending 表示降序,null 表示还原为原始顺序,

'ascending', 'descending', null

四:ref="table" ,this.$refs.table.sort('salesVolume','descending');

sort,手动对 Table 进行排序。参数prop属性指定排序列,order指定排序顺序。

相关推荐
变与不变80614 分钟前
js函数与封装详细解答
前端·javascript·vue.js
南雨北斗28 分钟前
Vue 3 项目中的拦截器的作用和写法(动态设置响应头适配表单文件上传)
前端
涛涛ing41 分钟前
125秒到10秒:TypeScript 7.0用Go重写编译器,前端圈等了14年
前端
爱勇宝1 小时前
初创公司的“自己人”,到底能当多久?
前端·后端·程序员
晴天161 小时前
前端模块化规范全景解析:CommonJS、AMD、ESM、UMD
前端
三十而立洋2 小时前
深入理解 npm:从核心机制到常用命令全解析
前端·前端工程化
Canace2 小时前
最新版 Codex 工作流的问题
前端·人工智能·agent
变与不变8062 小时前
引用类型、内存原理与对象
开发语言·前端·javascript
jearry2 小时前
给 C++ 老程序补现代 UI:WebView2 多入口资源加载与虚拟主机名实践
前端
打呵欠的猫2 小时前
让 AI 帮你写 Git Commit Message:从"fix bug"到语义化提交只需一个 Hook
前端·ai编程