四种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指定排序顺序。

相关推荐
米丘4 分钟前
Rollup 打包工具
前端
We་ct5 分钟前
LeetCode 74. 搜索二维矩阵:两种高效解题思路
前端·算法·leetcode·矩阵·typescript·二分查找
moneyinto6 分钟前
Three.js 必背核心方法
前端
wuhen_n8 分钟前
Vue3 组件中的图片懒加载与渐进式加载
前端·javascript·vue.js
叫回忆8 分钟前
elpis的npm抽离与发布
前端·javascript
wuhen_n16 分钟前
Vite 构建层面的图片优化:从压缩到转换
前端·javascript·vue.js
Irene199116 分钟前
Vue3 的 Proxy 与 Vue2 的 Object.defineProperty 的对比
vue.js·proxy·defineproperty
hashiqimiya17 分钟前
vue项目组装-路由-文件修改地方
前端·javascript·vue.js
Mike_jia28 分钟前
ChatClaw:5 分钟打造你的个人 AI 智能体
前端
CodeSheep29 分钟前
王自如公开招聘01号员工,这要求有多离谱?
前端·后端·程序员