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

相关推荐
祯民16 小时前
《复合型 AI Agent 开发:从理论到实践》实体书上架
前端
NEXT0616 小时前
深拷贝与浅拷贝的区别
前端·javascript·面试
不写八个16 小时前
PixiJS教程(一):快速搭建环境启动项目
前端·pixijs
菜鸟小芯16 小时前
【GLM-5 陪练式前端新手入门】第二篇:CSS 让网页从 “能用” 变 “好看”
前端·css
We་ct16 小时前
LeetCode 112. 路径总和:两种解法详解
前端·算法·leetcode·typescript
倚肆16 小时前
WebSocket连接教程示例(Spring Boot + STOMP + SockJS + Vue)
vue.js·spring boot·websocket
Hello.Reader17 小时前
Tauri 项目结构前端壳 + Rust 内核,怎么协作、怎么构建、怎么扩展
开发语言·前端·rust
Cache技术分享17 小时前
331. Java Stream API - Java Stream 实战案例:找出合作最多的作者对
前端·后端
We་ct17 小时前
LeetCode 129. 求根节点到叶节点数字之和:两种解法详解(栈+递归)
前端·算法·leetcode·typescript
Joker Zxc17 小时前
【前端基础(Javascript部分)】1、JavaScript的基础知识(组成、应用、编写方式、注释)
开发语言·前端·javascript