element-ui 表格数据时间格式化的方法


Posted in Javascript onAugust 24, 2018

后台返回时间格式  /1470220594000/

在element-ui  table 如何格式化呢 

1.首先

<el-table-column prop="AuditEndTime" label="处理时间" width="120" :formatter="dateFormat" align="center"></el-table-column>
 

主要是:formatter="dateFormat" 这个属性 

formatter 用来格式化内容 Function(row, column, cellValue, index)  

然后在   methods 方法对象里  添加 如下方法

//时间格式化
      dateFormat(row, column, cellValue, index){
          const daterc = row[column.property]
          if(daterc!=null){
            const dateMat= new Date(parseInt(daterc.replace("/Date(", "").replace(")/", ""), 10));
           const year = dateMat.getFullYear();
          const month = dateMat.getMonth() + 1;
          const day = dateMat.getDate();
          const hh = dateMat.getHours();
          const mm = dateMat.getMinutes();
          const ss = dateMat.getSeconds();
          const timeFormat= year + "/" + month + "/" + day + " " + hh + ":" + mm + ":" + ss;
          return timeFormat;
          }
          
      }

格式化后:

2018/2/27 8:59:19

PS:Element UI的表格table列的宽度自适应设置

不要设置  width="110px"

<el-table-column prop="login_id" align="center" label="工号"> </el-table-column>

<el-table-column prop="login_id" width="110px" align="center" label="工号"> </el-table-column>

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

Javascript 相关文章推荐
JavaScript.The.Good.Parts阅读笔记(一)假值与===运算符
Nov 16 Javascript
jquery对元素拖动排序示例
Jan 16 Javascript
javascript使用正则表达式检测IP地址
Dec 03 Javascript
jQuery UI库中dialog对话框功能使用全解析
Apr 23 Javascript
javascript 数组的正态分布排序的问题
Jul 31 Javascript
详细解读Jquery各Ajax函数($.get(),$.post(),$.ajax(),$.getJSON())
Aug 15 Javascript
修改Jquery Dialog 位置的实现方法
Aug 26 Javascript
AngularJS实现路由实例
Feb 12 Javascript
js+html制作简单日历的方法
Jun 27 Javascript
vue中子组件向父组件传递数据的实例代码(实现加减功能)
Apr 20 Javascript
微信小程序踩坑记录之解决tabBar.list[3].selectedIconPath大小超过40kb
Jul 04 Javascript
移动端滑动切换组件封装 vue-swiper-router实例详解
Nov 25 Javascript
vue select选择框数据变化监听方法
Aug 24 #Javascript
vue左侧菜单,树形图递归实现代码
Aug 24 #Javascript
jQuery md5加密插件jQuery.md5.js用法示例
Aug 24 #jQuery
element-ui中的select下拉列表设置默认值方法
Aug 24 #Javascript
vue 登录滑动验证实现代码
Aug 24 #Javascript
Vue 实现拖动滑块验证功能(只有css+js没有后台验证步骤)
Aug 24 #Javascript
vue .js绑定checkbox并获取、改变选中状态的实例
Aug 24 #Javascript
You might like
PHP写入WRITE编码为UTF8的文件的实现代码
2008/07/07 PHP
ThinkPHP后台首页index使用frameset时的注意事项分析
2014/08/22 PHP
详解PHP编码转换函数应用技巧
2016/10/22 PHP
JavaScript 给汉字排序实例代码
2008/06/28 Javascript
jQuery 学习6 操纵元素显示效果的函数
2010/02/07 Javascript
获取中文字符串的实际长度代码
2014/06/05 Javascript
如何正确使用javascript 来进行我们的程序开发
2014/06/23 Javascript
JavaScript学习心得之概述
2015/01/20 Javascript
jQuery选择器用法实例详解
2015/12/17 Javascript
javaScript嗅探执行神器-sniffer.js
2017/02/14 Javascript
Vue2.x中的父组件传递数据至子组件的方法
2017/05/01 Javascript
微信小程序自定义toast的实现代码
2018/11/16 Javascript
angularjs实现table表格td单元格单击变输入框/可编辑状态示例
2019/02/21 Javascript
[00:43]DOTA2小紫本全民票选福利PA至宝全方位展示
2014/11/25 DOTA
[01:15:15]VG VS EG Supermajor小组赛B组胜者组第一轮 BO3第二场 6.2
2018/06/03 DOTA
python实现通过代理服务器访问远程url的方法
2015/04/29 Python
Python实现列表删除重复元素的三种常用方法分析
2017/11/24 Python
用tensorflow搭建CNN的方法
2018/03/05 Python
利用Python正则表达式过滤敏感词的方法
2019/01/21 Python
Python实现K折交叉验证法的方法步骤
2019/07/11 Python
Pytorch提取模型特征向量保存至csv的例子
2020/01/03 Python
pyinstaller打包成无控制台程序时运行出错(与popen冲突的解决方法)
2020/04/15 Python
HTML5 新表单类型示例代码
2018/03/20 HTML / CSS
尤妮佳moony海外旗舰店:日本殿堂级纸尿裤品牌
2018/02/23 全球购物
Ryderwear美国官网:澳大利亚高端健身训练装备品牌
2018/04/24 全球购物
迪士尼英国官方商店:shopDisney UK
2019/09/21 全球购物
法国购买隐形眼镜和眼镜网站:Optical Center
2019/10/08 全球购物
Wiggle新西兰:自行车、跑步、游泳
2020/05/06 全球购物
详解如何解决使用JSON.stringify时遇到的循环引用问题
2021/03/23 Javascript
计算机应用专业学生的自我评价分享
2013/11/03 职场文书
经济管理专业毕业生推荐信
2013/11/11 职场文书
管理心得体会
2013/12/28 职场文书
聘任书的写作格式及范文
2014/03/29 职场文书
土建施工员岗位职责
2014/07/16 职场文书
技术负责人岗位职责
2015/02/10 职场文书
2015年志愿者服务工作总结
2015/04/20 职场文书