Element-ui table中过滤条件变更表格内容的方法


Posted in Javascript onMarch 02, 2018

组件中:

<el-table :data="users" highlight-current-row v-loading="listLoading" style="width: 100%;">
  <el-table-column prop="sex" label="性别" width="100" :formatter="formatSex" sortable>
  </el-table-column>
  <el-table-column prop="cz" label="操作" width="320">
     <template scope="scope">
       <el-button size="small" 
         @click="handleEdit(scope.$index, scope.row)">编辑
       </el-button>
       <el-button size="small" @click="handleEdit(scope.$index, scope.row)">
         {{scope.row.status | formatStatus}}
       </el-button>
     </template>
   </el-table-column>
</el-table>

js中:

filters: {
   formatStatus: function (val) {
    console.log(val)
    return val == 1 ? '上架' : val == 2 ? '下架' : '未知';
  },
},
methods: {
//性别显示转换
  formatSex: function (row, column) {
    return row.sex == 1 ? '男' : row.sex == 0 ? '女' : '未知';
  },
}

以上这篇Element-ui table中过滤条件变更表格内容的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
UserData用法总结 lanyu出品
Jul 01 Javascript
jQuery对表单元素的取值和赋值操作代码
May 19 Javascript
jQuery学习笔记 更改jQuery对象
Sep 19 Javascript
Jquery实现带动画效果的经典二级导航菜单
Mar 22 Javascript
JS循环遍历JSON数据的方法
Jul 08 Javascript
Bootstrap popover用法详解
Dec 22 Javascript
AngularJS2中一种button切换效果的实现方法(二)
Mar 27 Javascript
Vue.Draggable实现拖拽效果
Jul 29 Javascript
在Vue中获取组件声明时的name属性方法
Sep 12 Javascript
在Create React App中启用Sass和Less的方法示例
Jan 16 Javascript
了解在JavaScript中将值转换为字符串的5种方法
Jun 06 Javascript
JavaScript canvas仿代码流瀑布
Feb 10 Javascript
使用vue-aplayer插件时出现的问题的解决
Mar 02 #Javascript
VUE2.0+Element-UI+Echarts封装的组件实例
Mar 02 #Javascript
vue中添加mp3音频文件的方法
Mar 02 #Javascript
JS中利用FileReader实现上传图片前本地预览功能
Mar 02 #Javascript
select标签设置默认选中的选项方法
Mar 02 #Javascript
原生JavaScript实现todolist功能
Mar 02 #Javascript
js判断输入框不能为空格或null值的实现方法
Mar 02 #Javascript
You might like
PHP5.2下chunk_split()函数整数溢出漏洞 分析
2007/06/06 PHP
PHP之数组学习
2011/05/29 PHP
JS中encodeURIComponent函数用php解码的代码
2012/03/01 PHP
使用PHP获取汉字的拼音(全部与首字母)
2013/06/27 PHP
详解WordPress开发中get_header()获取头部函数的用法
2016/01/08 PHP
OAuth认证协议中的HMACSHA1加密算法(实例)
2017/10/25 PHP
一个很简单的办法实现TD的加亮效果.
2006/06/29 Javascript
在线编辑器的实现原理(兼容IE和FireFox)
2007/03/09 Javascript
javascript 获取网页参数系统
2008/07/19 Javascript
基于jquery的图片的切换(以数字的形式)
2011/02/14 Javascript
jquery实现简单易懂的图片展示小例子
2013/11/21 Javascript
jquery ajax,ashx,json的用法总结
2014/02/12 Javascript
JS实现带缓冲效果打开、关闭、移动一个层的方法
2015/05/09 Javascript
AngularJS 中的指令实践开发指南(一)
2016/03/20 Javascript
js实现浏览器倒计时跳转页面效果
2016/08/12 Javascript
浅谈JS继承_借用构造函数 &amp; 组合式继承
2016/08/16 Javascript
浅谈JavaScript中的属性:如何遍历属性
2017/09/14 Javascript
详解Vue2.0配置mint-ui踩过的那些坑
2018/04/23 Javascript
vuejs实现标签选项卡动态更改css样式的方法
2018/05/31 Javascript
vue 详情跳转至列表页实现列表页缓存
2019/03/27 Javascript
在Vue环境下利用worker运行interval计时器的步骤
2019/08/01 Javascript
echarts实现获取datazoom的起始值(包括x轴和y轴)
2020/07/20 Javascript
antd的select下拉框因为数据量太大造成卡顿的解决方式
2020/10/31 Javascript
[34:47]完美世界DOTA2联赛PWL S2 Magma vs LBZS 第一场 11.18
2020/11/18 DOTA
Python3.0中普通方法、类方法和静态方法的比较
2019/05/03 Python
numpy:找到指定元素的索引示例
2019/11/26 Python
Python解析多帧dicom数据详解
2020/01/13 Python
python中reload重载实例用法
2020/12/15 Python
使用HTML5做个画图板的方法介绍
2013/05/03 HTML / CSS
公司薪酬管理制度
2014/01/31 职场文书
《有趣的发现》教学反思
2014/04/15 职场文书
餐饮投资计划书
2014/04/25 职场文书
环保口号大全
2014/06/12 职场文书
业务员年终工作总结2015
2015/05/28 职场文书
团队拓展训练感想
2015/08/07 职场文书
教你用Python+selenium搭建自动化测试环境
2021/06/18 Python