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 相关文章推荐
打开超链需要“确认”对话框的方法
Mar 08 Javascript
javascript通过class来获取元素实现代码
Feb 20 Javascript
JS设置cookie、读取cookie
Feb 24 Javascript
js获取元素的标签名实现方法
Oct 08 Javascript
js 弹出虚拟键盘修改密码的简单实例
Oct 10 Javascript
JS对大量数据进行多重过滤的方法
Nov 04 Javascript
js实现拖拽功能
Mar 01 Javascript
jQuery实现可兼容IE6的滚动监听功能
Sep 20 jQuery
深入浅析golang zap 日志库使用(含文件切割、分级别存储和全局使用等)
Feb 19 Javascript
详解Vue串联过滤器的使用场景
Apr 30 Javascript
Vue和React有哪些区别
Sep 12 Javascript
JavaScript展开运算符和剩余运算符的区别详解
Feb 18 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扩展模块memcached长连接使用方法分析
2014/12/24 PHP
PHP函数nl2br()与自定义函数nl2p()换行用法分析
2016/04/02 PHP
PHP链表操作简单示例
2016/10/15 PHP
PHP面向对象程序设计之命名空间与自动加载类详解
2016/12/02 PHP
用js判断浏览器是否是IE的比较好的办法
2007/05/08 Javascript
prototype Element学习笔记(篇一)
2008/10/26 Javascript
jquery 学习之二 属性 文本与值(text,val)
2010/11/25 Javascript
用js来定义浏览器中一个左右浮动元素相对于页面主体宽度的位置的函数
2012/01/21 Javascript
Jquery实现列表(隔行换色,全选,鼠标滑过当前行)效果实例
2013/06/09 Javascript
javascript巧用eval函数组装表单输入项为json对象的方法
2015/11/25 Javascript
Bootstrap基本插件学习笔记之Popover提示框(19)
2016/12/08 Javascript
Angular 4依赖注入学习教程之ClassProvider的使用(三)
2017/06/04 Javascript
Vue自定义指令使用方法详解
2017/08/21 Javascript
vue小图标favicon不显示的解决方案
2017/09/19 Javascript
HTML5+JS+JQuery+ECharts实现异步加载问题
2017/12/16 jQuery
webpack4简单入门实例
2018/09/06 Javascript
Vue中的组件及路由使用实例代码详解
2019/05/22 Javascript
Layer.js实现表格溢出内容省略号显示,悬停显示全部的方法
2019/09/16 Javascript
Node.js中console.log()输出彩色字体的方法示例
2019/12/01 Javascript
JavaScript常用进制转换及位运算实例解析
2020/10/14 Javascript
[41:52]2018DOTA2亚洲邀请赛3月29日小组赛B组Effect VS Secret
2018/03/30 DOTA
Python获取运行目录与当前脚本目录的方法
2015/06/01 Python
梯度下降法介绍及利用Python实现的方法示例
2017/07/12 Python
python机器学习之决策树分类详解
2017/12/20 Python
Python使用type动态创建类操作示例
2020/02/29 Python
高中生毕业自我鉴定
2013/10/10 职场文书
学习党课思想汇报
2013/12/29 职场文书
机械系毕业生求职信
2014/05/28 职场文书
村党支部公开承诺书
2014/05/29 职场文书
公司证明怎么写
2014/09/22 职场文书
未婚证明书模板
2014/10/08 职场文书
场地使用证明模板
2014/10/25 职场文书
乡镇2014法制宣传日活动总结
2014/11/01 职场文书
2014年艾滋病防治工作总结
2014/12/10 职场文书
Jsonp劫持学习
2021/04/01 PHP
使用Mysql计算地址的经纬度距离和实时位置信息
2022/04/29 MySQL