作用:对从数据库中取出的数据进行处理后展示。

示例1:

partner1为从数据库中查询出的展示字段,值为数字id,需要转化成中文名称
partners为全量查询结果,包含了id与中文名称的一一对应关系
getPartnerName为数据处理函数,用以找到与id对应的中文名称
<!-- 伙伴名称 -->
<el-table-column prop="partner1" :formatter="getPartnerName" align="left" show-overflow-tooltip label="伙伴名称" width=""></el-table-column>
getPartnerName(row, col) {
console.log('partners', this.partners)
for (var i in this.partners) {
if (this.partners[i].pid === row.partner1) {
return this.partners[i].shortname
}
}
}

示例2:时间格式化

// 时间格式化
dateFormat (row, column) {
var date = row[column.property]
if (date === undefined) {
return ''
}
return DateTimeFormat(new Date(date), 'yyyy-mm-dd')
}

vue表格之:formatter=fun的更多相关文章

  1. 应用场景:vue表格撤销删除与保存按钮的显隐

    应用场景:vue表格撤销删除与保存按钮的显隐

  2. Vue表格中,对数据进行转换、处理

    众所周知,后端从Mysql取出的数据,一般是很难单独处理某一个Key的数据的(需要处理的话,可能会浪费大量的性能.而且对页面加载时间有很大的影响),所以,从数据库取出的数据.只能由前端进行处理.但是在 ...

  3. Vue表格中时间的处理

    Vue中表格的数据应该来自后台数据库,然后从数据库中读取到的数据,时间格式可能有些不同,我们可以根据实际需要来对这个时间进行转化. 这里介绍一个js库,它提供了强大的日期处理功能,功能强大且只有2k大 ...

  4. vue表格实现固定表头首列

    前言 最近在做vue移动端项目,需要做一个可以固定表头首列的表格,而且由于一些原因不能使用任何UI插件,网上找了很久也没什么好方法,所以在解决了问题之后,写下了这篇文章供后来人参考,文章有什么错漏的问 ...

  5. 基于iview 封装一个vue 表格分页组件

    iview 是一个支持中大型项目的后台管理系统ui组件库,相对于一个后台管理系统的表格来说分页十分常见的 iview是一个基于vue的ui组件库,其中的iview-admin是一个已经为我们搭好的后天 ...

  6. Vue 表格里的下拉列表

    下拉列表column-select.vue组件内容: <template> <div class="column-select-wrapper"> < ...

  7. vue 表格导出excel

    首先要install两个依赖, 1 npm install -S file-saver xlsx 2  npm install -D script-loader 在项目src目录下新建一个文件夹ven ...

  8. Vue 表格内容根据后台返回状态位填充文字

    本文地址:http://www.cnblogs.com/veinyin/p/8534365.html  Vue 做表格时我们常用的就是 v-for ,直接把 prop 绑定上去,但是如果表格内容需要我 ...

  9. vue表格中显示金额格式化与保存时格式化为数字并校验!

    最近项目中遇到了成本计算的,需要显示金额,保存一下,以后方便直接拿来用! 一 数字转金额格式显示 //数字转金额格式 format:function(s){ if(/[^0-9\.]/.test(s) ...

随机推荐

  1. sql中取出字符串中数字

    select substring(reverse('0->星光'),PATINDEX('%[0-9]%',reverse('0->星光')),1)

  2. Sublime Text自定制代码片段(Code Snippets)

    在编写代码的整个过程中,开发人员经常会一次又一次的改写或者重用相同的代码段,消除这种重复过程的方法之一是把我们经常用到的代码保存成代码片段(snippets),这使得我们可以方便的检索和使用它们. 为 ...

  3. java变量和数据类型

    变量 数据类型  变量名  =  数据值: 注意事项: 变量定义后可以不赋值,使用时再赋值.不赋值不能使用 变量使用时有作用域的限制. 变量不可以重复定义 数据类型转换 自动类型转换  范围大的数据类 ...

  4. MySQL Download

    { http://www.wampserver.com/#wampserver-64-bits-php-5-6-25-php-7 }

  5. docker删除未使用到的镜像

    docker image prune -a docker image prune -a -f  #-f强制,不需要确认

  6. vue中axios使用封装

    一.在main.js导入 // 引入axios,并加到原型链中 import axios from 'axios'; Vue.prototype.$axios = axios; import QS f ...

  7. Parse-轻松构建移动APP的后台服务

    目前正在开发的产品告一段落,有时间总结下经验,也顺便分享一下我们主要使用的平台-Parse. 什么是Parse?  Parse是一群美国人开发的专为移动APP服务的云计算平台,与现有的其他云计算平台相 ...

  8. EXCEL函数常用技巧浅析

    EXCEL函数常用技巧浅析 EXCEL函数是一门趣味性非常大的游戏,此贴内容基本上为总结前人经验而来.废话不多说,我们现在走入正题. 一:判断数值奇偶性 1.1  ISODD(number) 判断一个 ...

  9. vue-grid-layout

    vue-grid-layout    vue-grid-layout is a grid layout system, like Gridster, for Vue.js. Heavily inspi ...

  10. windows api(GDI)实现图片旋转

    GDI实现图片旋转,博主在网上找了好多资料,都不太如意. 并且在尝试中发现,如果先用SetViewportOrgEx将HDC上的坐标原点移动到图片中心:再在HDC上的获取每个点,用三角函数进行变换,算 ...