element-ui 表格sortable排序手动js清除

element-ui表格组件自带的排序功能如下,详见 Element表格排序

现在有个需求,是在列表之上增加搜索功能,而搜索之后,数据恢复默认不排序,

即:当前数据按照某个字段排序了,此时去搜索数据搜索出来的结果无需排序,就要讲排序状态清除,

查阅文档,发现element提供了 clearSort 方法

解决方法

html: 

<el-table ref="sortTable" :data="tableData">

js: 

this.$refs.sortTable.clearSort();

element-ui 重置清除排序规则及样式

     this.$nextTick(() =>{
       this.$refs.tableData.clearSort();
      })

如果使用tab组件,则会生成列表数组,需进行对应索引的列表清除排序

可打印this.refs.tableData,看返回的是书否是一个数组,如果是数组,就用this.refs.tableData0[0].clearSort();

以上为个人经验,希望能给大家一个参考,也希望大家多多支持Devmax。 

element-ui 表格sortable排序手动js清除方式的更多相关文章

  1. ios – 符合通用协议的结构类型,其关联类型也是协议

    在结构中,我想…是的,您可以使用AnySorter类型在DataHandler中保留属性.例如,对于一个人为的例子,我们可以让sortedItems成为一个计算属性,利用AnySorter实例对存储的项目列表进行排序(当然,实际上我们不希望对每个调用进行重新排序,但是仅适用于此示例!

  2. element-ui中导航组件menu的一个属性:default-active说明

    这篇文章主要介绍了element-ui中导航组件menu的一个属性:default-active说明,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. element-table如何实现自定义表格排序

    这篇文章主要介绍了element-table如何实现自定义表格排序,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  4. react.js组件实现拖拽复制和可排序的示例代码

    这篇文章主要介绍了react.js组件实现拖拽复制和可排序的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  5. jQuery+ajax读取json数据并按照价格排序示例

    这篇文章主要介绍了jQuery+ajax读取json数据并按照价格排序,涉及jQuery基于ajax动态获取json文件数据并进行数据遍历与排序的相关操作技巧,需要的朋友可以参考下

  6. python字典排序浅析介绍

    在数据处理时,为了方便统计经常使用字典存储数据。python中的字典是‘键:值’对的可变序列。排序时可以指定根据键或者是值为对象进行排序。用到的函数是sorted(),需要的朋友们下面随着小编来一起学习吧

  7. Vue实用功能之实现拖拽元素、列表拖拽排序

    在日常开发中,特别是管理端,经常会遇到要实现拖拽排序的效果,下面这篇文章主要给大家介绍了关于Vue实用功能之实现拖拽元素、列表拖拽排序的相关资料,需要的朋友可以参考下

  8. jQuery实现对无序列表的排序功能(附demo源码下载)

    这篇文章主要介绍了jQuery实现对无序列表的排序功能,涉及jQuery与javascript常见的文本操作函数与sort排序函数的相关使用方法,具有一定参考借鉴价值,需要的朋友可以参考下

  9. Java实现基本排序算法的示例代码

    排序就是将一串记录按照其中某个或某些关键字的大小,递增或递减的排列起来的操作。本文将用Java实现一些基本的排序算法,感兴趣的可以了解一下

  10. Angular排序实例详解

    本文通过实例给大家介绍了angular排序的相关知识,非常不错,具有参考借鉴价值,需要的朋友参考下吧

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部