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

示例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. "_CMTimeGetSeconds", referenced from:

    CMTime is defined in the CoreMedia.framework. Add that framework to your project.

  2. markdown 表情包大法

    前段时间偶然发现了markdown竟然可以插入表情,而且竟然如此的简单 表情包网站 (有可能是官网):点击跳转 这些东西真的是有点意思啊,容我举个栗子

  3. coco2dx android package..

    /Users/chong/Documents/engine/cocos2d-x-3.15.1/tools/cocos2d-console/bin/cocos compile -p android -m ...

  4. PKUSC加油加油加油!

    一句话,把学过的掌握的甚至还未掌握的,都用上吧! 1.题目不要再再再看错了!在纸上记下关键字. 2.记得有预处理这个东西可以降低复杂度! 3.仔细阅读数据范围,取值范围的0要注意! 4.不要每次像开新 ...

  5. Centos 6.5 python版本升级到2.7.8

    Centos6.5默认的 python版本是2.6 为了使用aliyuncli工具,直接用pip安装aliyuncli提示错误. 所以决定升级下python版本,但是yum依赖于python2.6,升 ...

  6. Allegro文档错误之:Iangle 命令

    Allegro绘制弧线时,可以使用add rarc命令,或者菜单栏里 Add|Arc w/Radius. 使用该命令时,需要输入3个参数: 1,圆心坐标:如 x –0.3 –0.8 2,半径,以及起始 ...

  7. Markdown转义字符表

  8. System.Drawing.Graphics.cs

    ylbtech-System.Drawing.Graphics.cs 1.程序集 System.Drawing, Version=4.0.0.0, Culture=neutral, PublicKey ...

  9. 左神算法进阶班1_1添加最少字符得到原字符N次

    Problem: 给定一个字符串str1,只能往str1的后面添加字符变成str2. 要求1:str2必须包含两个str1,两个str1可以有重合,但是不能以同一个位置开头. 要求2:str2尽量短最 ...

  10. InfluxDB的安装和简介

    InfluxDB简介 InfluxDB是一个时间序列数据库,旨在处理高写入和查询负载.它是TICK堆栈的组成部分 .InfluxDB旨在用作涉及大量带时间戳数据的任何用例的后备存储,包括DevOps监 ...