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实现的简单小巧的多级联动菜单
Mar 24 Javascript
$.ajax json数据传递方法
Nov 19 Javascript
javascript 网页跳转的方法
Dec 24 Javascript
关于js中window.location.href,location.href,parent.location.href,top.location.href的用法与区别
Oct 18 Javascript
Javascript在IE下设置innerHTML时出现未知的运行时错误的解决方法
Jan 12 Javascript
表单的焦点顺序tabindex和对应enter键提交
Jan 04 Javascript
JS长整型精度问题实例分析
Jan 13 Javascript
jquery实现的V字形显示效果代码
Oct 27 Javascript
jQuery实现简单的DIV拖动效果
Feb 19 Javascript
Bootstrap 模态框实例插件案例分析
Dec 28 Javascript
jQuery 实现左右两侧菜单添加、移除功能
Jan 02 jQuery
jQuery序列化form表单数据为JSON对象的实现方法
Sep 20 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项目开发中最常用的自定义函数整理
2010/12/02 PHP
PHP动态输出JavaScript代码实例
2015/02/12 PHP
分享5个非常有用的Laravel Blade指令
2018/05/30 PHP
javascript 事件查询综合 推荐收藏
2010/03/10 Javascript
fmt:formatDate的输出格式详解
2014/01/09 Javascript
JS实现可拖曳、可关闭的弹窗效果
2015/09/26 Javascript
JavaScript函数节流概念与用法实例详解
2016/06/20 Javascript
jquery 点击元素后,滚动条滚动至该元素位置的方法
2016/08/05 Javascript
JavaScript数据结构之单链表和循环链表
2017/11/28 Javascript
在vue-cli项目中使用bootstrap的方法示例
2018/04/21 Javascript
vue中使用v-for时为什么不能用index作为key
2020/04/04 Javascript
微信小程序实现简单文字跑马灯
2020/05/26 Javascript
Node.js中出现未捕获异常的处理方法
2020/06/29 Javascript
Python Sleep休眠函数使用简单实例
2015/02/02 Python
python3.5仿微软计算器程序
2020/03/30 Python
Pycharm学习教程(4) Python解释器的相关配置
2017/05/03 Python
python使用tensorflow保存、加载和使用模型的方法
2018/01/31 Python
python实现简单flappy bird
2018/12/24 Python
使用PyQtGraph绘制精美的股票行情K线图的示例代码
2019/03/14 Python
python区分不同数据类型的方法
2019/10/14 Python
python3常用的数据清洗方法(小结)
2019/10/31 Python
pyqt5中动画的使用详解
2020/04/01 Python
使用CSS3实现圆角,阴影,透明
2014/12/23 HTML / CSS
欧迪办公美国官网:Office Depot
2016/08/22 全球购物
基本款天堂:Everlane
2017/05/13 全球购物
函授自我鉴定
2013/11/06 职场文书
旅游业大学生创业计划书
2014/01/31 职场文书
销售提升方案
2014/06/07 职场文书
农业项目建议书
2014/08/25 职场文书
政风行风自查自纠报告
2014/10/21 职场文书
企业群众路线教育实践活动心得体会
2014/11/03 职场文书
公安机关起诉意见书
2015/05/20 职场文书
城南旧事电影观后感
2015/06/16 职场文书
2016年社区党支部公开承诺书
2016/03/25 职场文书
2016大学生诚信考试承诺书
2016/03/25 职场文书
CSS3 制作的悬停缩放特效
2021/04/13 HTML / CSS