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 相关文章推荐
vs2003 js文件编码问题的解决方法
Mar 20 Javascript
kmock javascript 单元测试代码
Feb 06 Javascript
jQuery LigerUI 使用教程入门篇
Jan 18 Javascript
javascript陷阱 一不小心你就中招了(字符运算)
Nov 10 Javascript
node.js中的path.normalize方法使用说明
Dec 08 Javascript
JS百度地图搜索悬浮窗功能
Jan 12 Javascript
详解vuex 中的 state 在组件中如何监听
May 23 Javascript
JS集合set类的实现与使用方法示例
Feb 01 Javascript
小程序server请求微信服务器超时的解决方法
May 21 Javascript
vue循环中点击选中再点击取消(单选)的实现
Sep 10 Javascript
vue 里面的 $forceUpdate() 强制实例重新渲染操作
Sep 21 Javascript
vue.js Router中嵌套路由的实用示例
Jun 27 Vue.js
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 fread()使用技巧
2010/01/22 PHP
PHP+jQuery 注册模块的改进(一):验证码存入SESSION
2014/10/14 PHP
Zend Framework实现多文件上传功能实例
2016/03/21 PHP
PHP数组去重的更快实现方式分析
2018/05/09 PHP
用js判断浏览器是否是IE的比较好的办法
2007/05/08 Javascript
JQuery最佳实践之精妙的自定义事件
2010/08/11 Javascript
js读取被点击次数的简单实例(从数据库中读取)
2014/03/07 Javascript
js脚本实现数据去重
2014/11/27 Javascript
JavaScript实现点击按钮字体放大、缩小
2016/02/29 Javascript
jQuery设置Cookie及删除Cookie实例分析
2016/04/15 Javascript
JavaScript禁止复制与粘贴的实现代码
2016/05/16 Javascript
JS未跨域操作iframe里的DOM
2016/06/01 Javascript
由浅入深剖析Angular表单验证
2016/07/14 Javascript
jQuery实现单击按钮遮罩弹出对话框效果(1)
2017/02/20 Javascript
React Native之prop-types进行属性确认详解
2017/12/19 Javascript
webpack 单独打包指定JS文件的方法
2018/02/22 Javascript
Angular 向组件传递模板的两种方法
2018/02/23 Javascript
详解关于vue2.0工程发布上线操作步骤
2018/09/27 Javascript
vue+iview动态渲染表格详解
2019/03/19 Javascript
laypage+SpringMVC实现后端分页
2019/07/27 Javascript
vue-以文件流-blob-的形式-下载-导出文件操作
2020/08/07 Javascript
vue项目开启Gzip压缩和性能优化操作
2020/10/26 Javascript
通过mod_python配置运行在Apache上的Django框架
2015/07/22 Python
Python爬虫实现爬取百度百科词条功能实例
2019/04/05 Python
python按修改时间顺序排列文件的实例代码
2019/07/25 Python
如何实现Django Rest framework版本控制
2019/07/25 Python
python 日志模块 日志等级设置失效的解决方案
2020/05/26 Python
python使用opencv resize图像不进行插值的操作
2020/07/05 Python
Python 如何创建一个线程池
2020/07/28 Python
Python3爬虫关于代理池的维护详解
2020/07/30 Python
如何利用python进行时间序列分析
2020/08/04 Python
泰坦健身器材:Titan Fitness
2018/02/13 全球购物
歌颂祖国的演讲稿
2014/05/04 职场文书
学生党员公开承诺书
2014/05/28 职场文书
小学生勤俭节约倡议书
2015/04/29 职场文书
Apache SkyWalking 监控 MySQL Server 实战解析
2022/09/23 Servers