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 相关文章推荐
jQuery boxy弹出层插件中文演示及使用讲解
Feb 24 Javascript
基于JQuery实现滚动到页面底端时自动加载更多信息
Jan 31 Javascript
JavaScript中的some()方法使用详解
Jun 09 Javascript
关于input全选反选恶心的异常情况
Jul 24 Javascript
简单模拟node.js中require的加载机制
Oct 27 Javascript
ES6新特性之Symbol类型用法分析
Mar 31 Javascript
简单实现js进度条加载效果
Mar 25 Javascript
angularjs实现猜大小功能
Oct 23 Javascript
Vue中render函数的使用方法
Jan 31 Javascript
纯javascript前端实现base64图片下载(兼容IE10+)
Sep 14 Javascript
微信小程序中插入激励视频广告并获取收益(实例代码)
Dec 06 Javascript
js中复选框的取值及赋值示例详解
Oct 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正则表达式 /i, /is, /s, /isU等介绍
2014/10/23 PHP
PHP中使用array函数新建一个数组
2015/11/19 PHP
PHP面向对象程序设计方法实例详解
2016/12/24 PHP
php 数据结构之链表队列
2017/10/17 PHP
PHP生成推广海报的方法分享
2018/04/22 PHP
javascript入门基础之私有变量
2010/02/23 Javascript
深入理解JavaScript系列(26):设计模式之构造函数模式详解
2015/03/03 Javascript
Web打印解决方案之证件套打的实现思路
2016/08/29 Javascript
HTML中setCapture、releaseCapture 使用方法浅析
2016/09/25 Javascript
js窗口震动小程序分享
2016/11/28 Javascript
基于jQuery实现简单人工智能聊天室
2017/02/10 Javascript
详解Vue.js入门环境搭建
2017/03/17 Javascript
浅谈原生JS中的延迟脚本和异步脚本
2017/07/12 Javascript
通俗解释JavaScript正则表达式快速记忆
2017/08/23 Javascript
vue-cli3环境变量与分环境打包的方法示例
2019/02/18 Javascript
js+html实现周岁年龄计算器
2019/06/25 Javascript
layui表格数据重载
2019/07/27 Javascript
JavaScript实现更换背景图片
2019/10/18 Javascript
[00:34]TI7不朽珍藏III——地穴编织者不朽展示
2017/07/15 DOTA
Python3.6安装及引入Requests库的实现方法
2018/01/24 Python
pyqt5的QWebEngineView 使用模板的方法
2018/08/18 Python
Python中logging实例讲解
2019/01/17 Python
Python3中函数参数传递方式实例详解
2019/05/05 Python
Python处理时间日期坐标轴过程详解
2019/06/25 Python
tensorflow的ckpt及pb模型持久化方式及转化详解
2020/02/12 Python
python将dict中的unicode打印成中文实例
2020/05/11 Python
python从PDF中提取数据的示例
2020/10/30 Python
使用canvas来完成线性渐变和径向渐变的功能的方法示例
2019/07/25 HTML / CSS
西班牙购买行李箱和背包网站:Maletas Greenwich
2019/10/08 全球购物
护士专业推荐信
2013/11/02 职场文书
大四学生毕业自荐信
2013/11/07 职场文书
《草虫的村落》教学反思
2014/02/16 职场文书
公安学专业求职信
2014/07/27 职场文书
交通事故赔偿协议书
2014/10/16 职场文书
2014年维修电工工作总结
2014/11/20 职场文书
Golang 1.18 多模块Multi-Module工作区模式的新特性
2022/04/11 Golang