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 相关文章推荐
prototype 1.5 &amp; scriptaculous 1.6.1 学习笔记
Sep 07 Javascript
初窥JQuery-Jquery简介 入门了解篇
Nov 25 Javascript
JS 跳转页面延迟2种方法
Mar 29 Javascript
JS 添加千分位与去掉千分位的示例
Jul 11 Javascript
详解JavaScript数组的操作大全
Oct 19 Javascript
jquery操作select元素和option的实例代码
Feb 03 Javascript
Easyui Tree获取当前选择节点的所有顶级父节点
Feb 14 Javascript
jQuery插件jquery.kxbdmarquee.js实现无缝滚动效果
Feb 15 Javascript
微信小程序教程系列之视图层的条件渲染(10)
Apr 19 Javascript
(模仿京东用户注册)用JQuery实现简单表单验证,初学者必看
Jan 08 jQuery
浅探express路由和中间件的实现
Sep 30 Javascript
Javascript实现html转pdf高清版(提高分辨率)
Feb 19 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生成不重复标识符的方法
2014/11/21 PHP
php注册系统和使用Xajax即时验证用户名是否被占用
2017/08/31 PHP
PHP中实现中文字串截取无乱码的解决方法
2018/05/29 PHP
php命名空间设计思想、用法与缺点分析
2019/07/17 PHP
JavaScript iframe的相互操作浅析
2009/10/14 Javascript
IE8 中使用加速器(Activities)
2010/05/14 Javascript
JQuery拖拽元素改变大小尺寸实现代码
2012/12/10 Javascript
jQuery实现友好的轮播图片特效
2015/01/12 Javascript
JavaScript中的方法重载实例
2015/03/16 Javascript
js实现缓冲运动效果的方法
2015/04/10 Javascript
JQuery学习总结【一】
2016/12/01 Javascript
jquery实现侧边栏左右伸缩效果的示例
2017/12/19 jQuery
浅谈Angular 观察者模式理解
2018/11/01 Javascript
微信小程序如何调用图片接口API并居中显示
2019/06/29 Javascript
编写一个javascript元循环求值器的方法
2020/04/14 Javascript
jQuery是用来干什么的 jquery其实就是一个js框架
2021/02/04 jQuery
[02:05]2014DOTA2西雅图邀请赛 老队长全明星大猜想谁不服就按进显示器
2014/07/08 DOTA
[47:55]Ti4第二日主赛事败者组 NaVi vs EG 1
2014/07/20 DOTA
Python socket实现简单聊天室
2018/04/01 Python
彻彻底底地理解Python中的编码问题
2018/10/15 Python
在pytorch中对非叶节点的变量计算梯度实例
2020/01/10 Python
Python自带的IDE在哪里
2020/07/01 Python
Python使用tkinter实现摇骰子小游戏功能的代码
2020/07/02 Python
一款纯css3实现简单的checkbox复选框和radio单选框
2014/11/05 HTML / CSS
美国在线精品家居网站:Burke Decor
2017/04/12 全球购物
印度在线购物网站:Paytmmall
2019/07/24 全球购物
10条PHP编程习惯
2014/05/26 面试题
飞利信loadrunner和软件测试笔试题
2012/09/22 面试题
党员承诺书内容
2014/03/26 职场文书
欢迎标语大全
2014/06/21 职场文书
办理护照工作证明
2014/10/10 职场文书
农业项目投资意向书
2015/05/09 职场文书
学校2015年纠风工作总结
2015/05/15 职场文书
2019年自助餐厅创业计划书模板
2019/08/22 职场文书
Win11黑色桌面背景怎么办?Win11黑色壁纸解决方法汇总
2022/04/05 数码科技
MySQL去除密码登录告警的方法
2022/04/20 MySQL