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 XML操作 封装类
Jul 01 Javascript
JS TextArea字符串长度限制代码集合
Oct 31 Javascript
使用jQuery时Form表单元素ID和name命名大忌
Mar 06 Javascript
10分钟学会写Jquery插件实例教程
Sep 06 Javascript
sails框架的学习指南
Dec 22 Javascript
JS实现新浪微博效果带遮罩层的弹出框代码
Oct 12 Javascript
JavaScript事件类型中UI事件详解
Jan 14 Javascript
js随机生成一个验证码
Jun 01 Javascript
Javascript中 toFixed四舍六入方法
Aug 21 Javascript
原生JS实现Ajax跨域请求flask响应内容
Oct 24 Javascript
vue中进入详情页记住滚动位置的方法(keep-alive)
Sep 21 Javascript
jQuery 实现扁平式小清新导航
Jul 07 jQuery
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代码 用PHP写出自己的BLOG系统
2010/04/12 PHP
ThinkPHP跳转页success及error模板实例教程
2014/07/17 PHP
PHP strip_tags保留多个HTML标签的方法
2016/05/22 PHP
php解决DOM乱码的方法示例代码
2016/11/20 PHP
NodeJs基本语法和类型
2015/02/13 NodeJs
jQuery页面元素动态添加后绑定事件丢失方法,非 live
2016/06/16 Javascript
jQuery操作dom实现弹出页面遮罩层(web端和移动端阻止遮罩层的滑动)
2016/08/25 Javascript
BootStrap中的表单大全
2016/09/07 Javascript
深入理解JavaScript中的并行处理
2016/09/22 Javascript
基于Bootstrap表单验证功能
2017/11/17 Javascript
JavaScript累加、迭代、穷举、递归等常用算法实例小结
2018/05/08 Javascript
微信小程序swiper禁止用户手动滑动代码实例
2019/08/23 Javascript
JS实现手写 forEach算法示例
2020/04/29 Javascript
js实现删除json中指定的元素
2020/09/22 Javascript
[03:01]2014DOTA2国际邀请赛 DC:我是核弹粉,为Burning和国土祝福
2014/07/13 DOTA
python图像处理之镜像实现方法
2015/05/30 Python
Python中将字典转换为列表的方法
2016/09/21 Python
浅谈Python实现贪心算法与活动安排问题
2017/12/19 Python
Python绘制3d螺旋曲线图实例代码
2017/12/20 Python
python基础教程项目二之画幅好画
2018/04/02 Python
Python Django切换MySQL数据库实例详解
2019/07/16 Python
Python pexpect模块及shell脚本except原理解析
2020/08/03 Python
Django DRF APIView源码运行流程详解
2020/08/17 Python
HTML5 Canvas画线技巧——实现绘制一个像素宽的细线
2013/08/02 HTML / CSS
html5版canvas自由拼图实例
2014/10/15 HTML / CSS
Canvas globalCompositeOperation
2018/12/18 HTML / CSS
adidas马来西亚官网:adidas MY
2020/09/12 全球购物
房地产开发计划书
2014/01/10 职场文书
车辆工程专业求职信
2014/04/28 职场文书
幼儿园父亲节活动总结
2015/02/12 职场文书
请假条应该怎么写?
2019/06/24 职场文书
2019让人心动的商业计划书
2019/06/27 职场文书
Java框架入门之简单介绍SpringBoot框架
2021/06/18 Java/Android
mysql优化之query_cache_limit参数说明
2021/07/01 MySQL
bose降噪耳机音能消除人声吗
2022/04/19 数码科技
Python实现对齐打印 format函数的用法
2022/04/28 Python