详解vue2.0的Element UI的表格table列时间戳格式化


Posted in Javascript onJune 13, 2017

这两天学习了vue2.0的Element UI的表格table列时间戳格式化,所以,今天添加一点小笔记。

表格属性

<el-table 
        :data="tableData" 
        v-loading.body="loading" 
        border 
        @selection-change="selectionChange" 
        style="width: 100%"> 
      <el-table-column 
          prop="createTime" 
          label="创建时间" 
          :formatter="dateFormat" 
          width="150"> 
      </el-table-column> 
      <el-table-column 
          prop="updateTime" 
          label="更新时间" 
          width="150"> 
      </el-table-column>       
    </el-table>

script

new Vue({ 
    el: '#tableView', 
    data: { 
      //列表数据 
      tableData: [{ 
      "createTime":1491559642000, 
      "updateTime":1491559642000 
      }], 
    }, 
    methods:{ 
      //时间格式化 
      dateFormat:function(row, column) { 
        var date = row[column.property]; 
     if (date == undefined) { 
       return ""; 
     } 
     return moment(date).format("YYYY-MM-DD HH:mm:ss"); 
      } 
    } 
  });

简单来说,vue组件传入的方法函数应该使用v-bind属性绑定

时间格式化使用moent.js

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用正则表达式 动态创建/增加css style script 兼容IE firefox
Mar 10 Javascript
JS 巧妙获取剪贴板数据 Excel数据的粘贴
Jul 09 Javascript
Jquery 表单取值赋值的一些基本操作
Oct 11 Javascript
javascript 原型继承介绍
Aug 30 Javascript
深入理解JavaScript系列(8) S.O.L.I.D五大原则之里氏替换原则LSP
Jan 15 Javascript
Javascript中的Array数组对象详谈
Mar 03 Javascript
Google Maps API地图应用示例分享
Oct 23 Javascript
一个字符串中出现次数最多的字符 统计这个次数【实现代码】
Apr 29 Javascript
js改变style样式和css样式的简单实例
Jun 28 Javascript
使用 vue.js 构建大型单页应用
Feb 10 Javascript
vue实现自定义H5视频播放器的方法步骤
Jul 01 Javascript
基于redis的小程序登录实现方法流程分析
May 25 Javascript
微信小程序调用PHP后台接口 解析纯html文本
Jun 13 #Javascript
vue时间格式化实例代码
Jun 13 #Javascript
详解vue slot插槽的使用方法
Jun 13 #Javascript
详解Vue.js分发之作用域槽
Jun 13 #Javascript
Javascript实现从小到大的数组转换成二叉搜索树
Jun 13 #Javascript
微信小程序实现移动端滑动分页效果(ajax)
Jun 13 #Javascript
详解AngularJs路由之Ui-router-resolve(预加载)
Jun 13 #Javascript
You might like
php获取服务器端mac和客户端mac的地址支持WIN/LINUX
2014/05/15 PHP
PHP中的命名空间详细介绍
2015/07/02 PHP
初识PHP中的Swoole
2016/04/05 PHP
PHP有序表查找之插值查找算法示例
2018/02/10 PHP
基于jQuery的烟花效果(运动相关)点击屏幕出烟花
2012/06/14 Javascript
json对象转字符串如何实现
2012/12/02 Javascript
JavaScript常用全局属性与方法记录积累
2013/07/03 Javascript
JQuery记住用户名和密码的具体实现
2014/04/04 Javascript
JavaScript插件化开发教程(五)
2015/02/01 Javascript
javascript操作Cookie(设置、读取、删除)方法详解
2015/03/18 Javascript
BootStrap栅格系统、表单样式与按钮样式源码解析
2017/01/20 Javascript
原生js实现鼠标跟随效果
2017/02/28 Javascript
浅谈JavaScript find 方法不支持IE的问题
2017/09/28 Javascript
angular基于ng-alain定义自己的select组件示例
2018/02/23 Javascript
小程序云开发教程如何使用云函数实现点赞功能
2019/05/18 Javascript
vue-router的两种模式的区别
2019/05/30 Javascript
Node.js设置定时任务之node-schedule模块的使用详解
2020/04/28 Javascript
JavaScript中变量提升和函数提升的详解
2020/08/07 Javascript
python简单的函数定义和用法实例
2015/05/07 Python
Python中你应该知道的一些内置函数
2017/03/31 Python
Python算法之求n个节点不同二叉树个数
2017/10/27 Python
Python实现堡垒机模式下远程命令执行操作示例
2019/05/09 Python
Python容器使用的5个技巧和2个误区总结
2019/09/26 Python
Python 内置函数globals()和locals()对比详解
2019/12/23 Python
Python中logging日志库实例详解
2020/02/19 Python
Python操作Jira库常用方法解析
2020/04/10 Python
python Scrapy框架原理解析
2021/01/04 Python
字符串str除首尾字符外的其他字符按升序排列
2013/03/08 面试题
社团活动策划书范文
2014/01/09 职场文书
小学生元旦感言
2014/02/26 职场文书
艺术学院毕业生自我评价
2014/03/02 职场文书
难忘的一天教学反思
2014/04/30 职场文书
舞蹈兴趣小组活动总结
2014/07/07 职场文书
幼儿园端午节活动方案
2014/08/25 职场文书
本科毕业论文指导教师评语
2014/12/30 职场文书
2015年工会工作总结
2015/03/30 职场文书