Element UI 表格排序只排了当前页,解决方案如下:

定义方法:

/** 比较
* @param {string} propertyName 属性值
* @param {string} sort 当前顺序
* @returns {Object}
*/
export function compare(propertyName, sort) {
return function (obj1, obj2) {
var value1 = obj1[propertyName]
var value2 = obj2[propertyName]
if (typeof value1 === 'string' && typeof value2 === 'string') {
const res = value1.localeCompare(value2, 'zh')
return sort === 'ascending' ? res : -res
} else {
if (value1 <= value2) {
return sort === 'ascending' ? -1 : 1
} else if (value1 > value2) {
return sort === 'ascending' ? 1 : -1
}
}
}
}

vue

<el-table
class="mytable"
v-loading="tableLoading"
ref="myTable"
:data="blist | dataslice(listQuery.page, listQuery.limit)"
element-loading-text="拼命加载中......"
empty-text="没有找到匹配的记录"
border
fit
highlight-current-row
@sort-change="sortChange"
>
<el-table-column align="center" label="版本" prop="version" sortable="custom"/>
<el-table-column align="center" label="批次" prop="batchid" sortable="custom"/>
<el-table-column align="center" label="修改用户" prop="updator" sortable="custom"/>
<el-table-column align="center" label="状态" prop="status" sortable="custom"/>
</el-table>
 sortChange({column, prop, order}) {
this.blist.sort(compare(prop, order));
},

Element UI 表格排序所有页的更多相关文章

  1. element ui 表格提交时获取所有选中的checkbox的数据

    <el-table ref="multipleTable" :data="appList" @selection-change="changeF ...

  2. Vue 基于node npm & vue-cli & element UI创建vue单页应用

    基于node npm & vue-cli & element UI创建vue单页应用 开发环境   Win 10   node-v10.15.3-x64.msi 下载地址: https ...

  3. Element UI表格组件技巧:如何简洁实现跨页勾选、跨页统计功能

    业务场景 在使用Element UI的Table组件时,常常面对这样的业务需求: 表格数据的每一项都要提供勾选框,当切换分页时,能够记忆所有页面勾选的数据,以实现批量提交不同页面勾选数据的功能.并且, ...

  4. 封装一个优雅的element ui表格组件

    现在做后台系统用vue + elementUI 的越来越多,那element ui的 el-table 组件肯定也离不开.虽然element ui的table组件很好.但是表格和分页是分离的.每次写表 ...

  5. vue2.0+Element UI 表格前端分页和后端分页

    之前写过一篇博客,当时对element ui框架还不太了解,分页组件用 html + css 自己写的,比较麻烦,而且只提到了后端分页 (见 https://www.cnblogs.com/zdd20 ...

  6. vue + element ui 表格自定义表头,提供线上demo

    前言:工作中用到 vue+element ui 的前端框架,需要使用自定义表头,需要使用 re.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9710826.h ...

  7. element UI表格行高、padding等设置报错问题

    element UI里面表格的行高需要自己调整高度和设置padding,直接写style是不行的,里面有 : 1.row-style (行的 style) 2.header-row-styl   (表 ...

  8. element ui表格常用功能如:导出 新增 删除 多选 跨页多选 固定表头 多级表头 合并行列 等常见需求

    <template> <div class="table-cooperte"> <el-table :data="tableData&quo ...

  9. element ui里面table分页,页数从0开始的怎么做?

    需求: 后台请求的接口是从0页开始的,但是pagination是从1开始的,就是在点击pagination的第1页是后台转0 1首先在data里面定义为1,其他地方也是定义1 return { for ...

  10. element ui表格表头顺序错乱的问题

    因为在项目中两个表格共用了同一个组件, 但由于表头不完全相同, 就通过v-if来控制表头的显示隐藏,没想到造成了表头顺序的错乱, 经过多方查找资料,最后找到了解决方法: 即为每一列el-table-c ...

随机推荐

  1. 本地部署 Overleaf 服务

    ️ 注意:本教程只适用于 macOS / Linux 操作系统.如果需要在 Windows 上部署 Overleaf,请先安装 WSL,之后在 WSL 中部署 Overleaf . 本地部署 Over ...

  2. 如何用VMWARE创建一个Linux虚拟机

    序言 各位好啊,我是会编程的蜗牛,作为java开发者,我们都是需要接触Linux服务器的,一般部署应用都是部署在Linux服务器上的~ 但一般的服务器要么需要购买,要么只是公司里的,那么有没有免费的L ...

  3. 系统编程-进程-exec系列函数超级详解(带各种实操代码)

    我的相关博文: 系统编程-进程-close-on-exec机制 PART1  exec系列函数功能简介 exec系列函数登场 常规操作是先fork一个子进程,然后在子进程中调用exec系列函数执行新的 ...

  4. OPENLDAP部署完整版(Linux)附一键式脚本

    (一)环境信息1,系统环境2,域信息(本章节使用)(二)应用部署1,ladp部署1. yum方式安装OpenLDAP服务2.拷贝数据库配置配置文件,并启动服务3.slappasswd生成OpenLDA ...

  5. 第6天:基础入门-抓包技术&HTTPS协议&APP&小程序&PC应用&WEB&转发联动

    安装charles 到Windows本地: 安卓模拟器安装: 如果抓模拟器就要使用从远程主机,如果不是,则从所有进程 访问 谷歌浏览器安装证书: PC微信小程序代理抓取: 41:43 :如何将char ...

  6. AD域下,环境下办公机系统时间不准确

    事件起因: 某部门一同事电脑时间和AD域控时间相差3分钟,虽然说时间相差5分钟内问题不大,但是本着有问题就解决的原则,还是花了点时间去查资料解决. (小小吐槽一下,在我看来域控机是掌管下面所有的办公机 ...

  7. 【赵渝强老师】阿里云大数据ACP认证之阿里大数据产品体系

    阿里大数据产品体系是基于阿里云飞天平台上的数据处理服务.主要分为阿里云大数据基础产品和阿里云数加平台,其产品架构图如下所示: 一.阿里云大数据基础产品 1.云数据库--RDS(ApsaraDB for ...

  8. ftrace options 中的irq-info

    /sys/kernel/debug/tracing/options/irq_info 是 ftrace 中的一个选项,用于启用或禁用有关中断的详细信息的跟踪. options/irq_info 的具体 ...

  9. HTTP常用返回结果状态码

    摘编自<图解HTTP> HTTP状态码负责表示客户端 HTTP请求的返回结果.标记服务器端的处理是否正常.通知出现的错误等工作.状态码的职责是当客户端向服务器端发送请求时,描述返回的请求 ...

  10. 无需等待Vue Release发布,就能在项目中体验最新版

    前言 两个月前尤大在Vue 仓库中引入了 pkg.pr.new,有了这个后Vue仓库中的每个commit或者PR都会自动触发一个新的发布,我们就可以在项目中体验最新版本的Vue啦. 关注公众号:[前端 ...