详解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 相关文章推荐
JS的replace方法详细介绍
Nov 09 Javascript
用js实现小球的自由移动代码
Apr 22 Javascript
javascript基本类型详解
Nov 28 Javascript
angular简介和其特点介绍
Jan 29 Javascript
jQuery插件jRumble实现网页元素抖动
Jun 05 Javascript
jQuery实现页面评论栏中访客信息自动填写功能的方法
May 23 Javascript
js判断是否为空和typeof的用法(详解)
Oct 07 Javascript
jquery实现图片列表鼠标移入微动
Dec 01 Javascript
JS html事件冒泡和事件捕获操作示例
May 01 Javascript
vue 强制组件重新渲染(重置)的两种方案
Oct 29 Javascript
jQuery实现高度灵活的表单验证功能示例【无UI】
Apr 30 jQuery
使用纯前端JavaScript实现Excel导入导出方法过程详解
Aug 07 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
CodeIgniter中使用cookie的三种方式详解
2014/07/18 PHP
Yii隐藏URL中index.php的方法
2016/07/12 PHP
PHP生成腾讯云COS接口需要的请求签名
2018/05/20 PHP
jQuery入门第一课 jQuery选择符
2010/03/14 Javascript
JQUERY获取form表单值的代码
2010/07/17 Javascript
从零开始学习jQuery (二) 万能的选择器
2010/10/01 Javascript
第十篇BootStrap轮播插件使用详解
2016/06/21 Javascript
Vuejs第十三篇之组件——杂项
2016/09/09 Javascript
JS中用try catch对代码运行的性能影响分析
2016/12/26 Javascript
js判断输入框不能为空格或null值的实现方法
2018/03/02 Javascript
js中时间格式化的几种方法
2018/07/22 Javascript
Vue项目安装插件并保存
2019/01/28 Javascript
vue-property-decorator用法详解
2019/12/12 Javascript
H5实现手机拍照和选择上传功能
2019/12/18 Javascript
ant design vue 表格table 默认勾选几项的操作
2020/10/31 Javascript
[55:25]VGJ.T vs Optic Supermajor小组赛D组 BO3 第三场 6.3
2018/06/04 DOTA
Python导出DBF文件到Excel的方法
2015/07/25 Python
Python中list初始化方法示例
2016/09/18 Python
解决python3爬虫无法显示中文的问题
2018/04/12 Python
Python地图绘制实操详解
2019/03/04 Python
Python3.5面向对象程序设计之类的继承和多态详解
2019/04/24 Python
python中count函数简单的实例讲解
2020/02/06 Python
解决Python Matplotlib绘图数据点位置错乱问题
2020/05/16 Python
浅析CSS3中鲜为人知的属性:-webkit-tap-highlight-color
2017/01/12 HTML / CSS
美国最大的香水连锁店官网:Perfumania
2016/08/15 全球购物
微软新西兰官方网站:Microsoft New Zealand
2018/08/17 全球购物
酒店工作职员求职简历的自我评价
2013/10/23 职场文书
主题婚礼策划方案
2014/02/10 职场文书
村支部书记群众路线对照检查材料思想汇报
2014/10/08 职场文书
2015小学教师德育工作总结
2015/05/12 职场文书
房产遗嘱范本
2015/08/06 职场文书
教师病假条范文
2015/08/17 职场文书
导游词之湖州-太湖
2019/10/11 职场文书
Python Pygame实战在打砖块游戏的实现
2022/03/17 Python
奥特曼十大神器:奥特手镯在榜,第一是贝利亚的神器
2022/03/18 日漫
JavaScript实现音乐播放器
2022/08/14 Javascript