<el-table-column prop="productEnvVersion" label="运行环境" :filters="this.runArr" :filter-method="filterTag" filter-placement="bottom-end" :filter-multiple="false" column-key="runTimeEnv">
  <template scope="scope">
    <env :rowData="scope.row" v-on:envLookData="lookData"></env>
</template>
</el-table-column>

filters:在vue,data里,写上你需要的文字,对应传递给后台的value:例如---   runArr: [{ text: '线上', value: 1 }, { text: '预发', value: 2 }]

效果对比如下:(去掉了多选框,筛选、重置按钮)

vue element-ui 表格筛选,点击筛选数据的更多相关文章

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

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

  2. vue+element ui 表格自定义样式溢出隐藏

    样式 .hoveTitle { text-align: left; width: 140px; overflow: hidden; text-overflow: ellipsis; white-spa ...

  3. vue+element ui 的表格列使用组件

    前言:工作中用到 vue+element ui 的前端框架,有这个场景:很多表格的列有许多一样的,所以考虑将列封装为组件.转载请注明出处:https://www.cnblogs.com/yuxiaol ...

  4. vue + element ui 实现实现动态渲染表格

    前言:之前需要做一个页面,能够通过表名动态渲染出不同的表格,这里记录一下.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9786326.html 网站地址:我的 ...

  5. vue+element ui 的上传文件使用组件

    前言:工作中用到 vue+element ui 的前端框架,使用到上传文件,则想着封装为组件,达到复用,可扩展.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9 ...

  6. vue+element ui 的tab 动态增减,切换时提示用户是否切换

    前言:工作中用到 vue+element ui 的前端框架,动态添加 Tab,删除 Tab,切换 Tab 时提示用户是否切换等,发现 element ui  有一个 bug,这里记录一下如何实现.转载 ...

  7. 基于 vue+element ui 的cdn网站(多页面,都是各种demo)

    前言:这个网站持续更新中...,有网上预览,github上也有源码,喜欢记得star哦,欢迎留言讨论. 网站地址:我的个人vue+element ui demo网站 github地址:yuleGH g ...

  8. Vue+element ui table 导出到excel

    需求: Vue+element UI table下的根据搜索条件导出当前所有数据 参考: https://blog.csdn.net/u010427666/article/details/792081 ...

  9. vue+element ui中select组件选择失效问题原因与解决方法

    codejing 2020-07-10 09:13:31  652  收藏 分类专栏: Web Vue Element UI 版权 .当表单form赋完值后,如果后续又对form中某一属性值进行操作如 ...

  10. 分享一个自搭的框架,使用Spring boot+Vue+Element UI

    废弃,新的:https://www.cnblogs.com/hackyo/p/10453243.html 特点:前后端分离,可遵循restful 框架:后端使用Spring boot,整合了aop.a ...

随机推荐

  1. jdk8中的StreamAPI

    1.实体类 package com.zy.model; import lombok.AllArgsConstructor; import lombok.Builder; import lombok.D ...

  2. 最大公约数(gcd)和 最小公倍数(lcm)——辗转相除法

    辗转相除法(又称欧几里得算法)是求最大公因数的算法 要求a,b的最大公约数(a>b),我们可以递归地求b,a%b的最大公约数,直到其中一个数变成0,这时另一个数就是a,b的最大公约数. C++实 ...

  3. 如何将.crt的ssl证书文件转换成.pem格式

    如何将.crt的ssl证书文件转换成.pem格式 摘自:https://www.landui.com/help/show-8127 2018-07-04 14:55:41 2158次 准备:有一台安装 ...

  4. Spring Boot☞ 使用freemarker模板引擎渲染web视图

    效果图 代码 package com.wls.integrateplugs.hello.controller; /** * Created by wls on 2017/8/24. */ import ...

  5. Spring 注解 整理

    首先 在xml中配置 xmlns:context="http://www.springframework.org/schema/context" http://www.spring ...

  6. 【转载】Mysql中的Btree与Hash索引比较

    转载地址:http://www.jb51.net/article/62533.htm 这篇文章主要介绍了Mysql中的Btree与Hash索引比较,本文起讲解了B-Tree 索引特征.Hash 索引特 ...

  7. error: failed to push some refs to 'https://git.oschina.net/bluede/TuShuGuanLi.g it'

    出现了这样的错,可以强制提交 git push -u origin master -f

  8. IIS请求筛选模块被配置为拒绝包含双重转义序列的请求404.11

    文件目录有这样一个包含了加号的文件:2015年日历表(A4+版).pdf 现在要求下载此文件,考虑这样一个url /UploadFile/2015年日历表(A4+版).pdf 如果在浏览器访问这个ur ...

  9. C#延迟执行

    借鉴于该篇博客:http://kb.cnblogs.com/page/42581/ 先看两个方法 public class YieldClasses { public static IEnumerab ...

  10. ACM 韩信点兵 、n的另一种阶乘、6174的问题

    3.6174问题 描述 假设你有一个各位数字互不相同的四位数,把所有的数字从大到小排序后得到a,从小到大后得到b,然后用a-b替换原来这个数,并且继续操作.例如,从1234出发,依次可以得到4321- ...