elementUI 时间格式化

elementUI 时间格式化1.html:<el-table-columnprop=”dateTime”:formatter=”dateFormat”label=”日期”></el-table-column>2.vue的methods里面//方法methods:{//时间格式化dateFormat(row,colum…

大家好,又见面了,我是你们的朋友全栈君。

1.html:

<el-table-column
      prop="dateTime"
      :formatter="dateFormat"
      label="日期">
</el-table-column>

2.vue的methods 里面

//方法
methods: {
    //时间格式化
    dateFormat(row,column){
       var dT=new Date(row.dateTime);//row 表示一行数据, dateTime 表示要格式化的字段名称
       return dT.getFullYear()+"-"+(dT.getMonth()+1)+"-"+dT.getDate()+" "+dT.getHours()+":"+dT.getMinutes()+":"+dT.getSeconds()+"."+dT.getMilliseconds();
     },

  //时间格式化2
  dataFormat2(row,column){
      var t=new Date(row.dateTime);//row 表示一行数据, dateTime 表示要格式化的字段名称
      var year=t.getFullYear(),
          month=t.getMonth()+1,
          day=t.getDate(),
          hour=t.getHours(),
          min=t.getMinutes(),
          sec=t.getSeconds();
      var newTime=year+'-'+
          (month<10?'0'+month:month)+'-'+
          (day<10?'0'+day:day)+' '+
          (hour<10?'0'+hour:hour)+':'+
          (min<10?'0'+min:min)+':'+
          (sec<10?'0'+sec:sec);
      return newTime;
  },
},

2020-01-07T16:00:00.000Z  该格式是element的默认时间输出格

效果图

2020-1-7 0:0:0.0

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/143909.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • ov7725 stm32_如何给实验培养皿拍照

    ov7725 stm32_如何给实验培养皿拍照平台:STM32ZET6(核心板)+ST-LINK/V2+SD卡+USB串口线+鹰眼OV7725摄像头(注意,为了减少摄像头连线的麻烦,建议初学者选取单片机时选用带有摄像头接口的板子)工程介绍:需要移植FatFs文件系统,同时需要了解BMP位图的存储数据结构,从而实现将摄像头输出的RGB565像素数据直接输出到sd卡上,保存为*.bmp文件。1.BMP位图的存储1.1 数据结构介绍//BMP头文…

    2022年9月24日
    2
  • linux shell 脚本 入门到实战详解[⭐建议收藏!!⭐]

    linux shell 脚本 入门到实战详解[⭐建议收藏!!⭐]文章目录shell入门到实战详解[⭐建议收藏!!⭐]关于作者**作者介绍**一、shell入门简介1.1什么是shell1.2shell编程注意事项1.3第一个shell脚本helloworld二、shell环境变量讲解2.1shell变量详解2.2shell系统变量介绍2.3shell环境变量介绍2.3.1常见的系统环境变量2.4shell用户环境变量介绍2.4.1自定义shell环境变量2.4.2echo打印菜单栏2.4.3shell中彩色输出h

    2022年7月24日
    9
  • mb10整流桥参数_kbp204整流桥参数

    mb10整流桥参数_kbp204整流桥参数编辑-ZMB10F在MBF-4封装里采用的4个芯片,其尺寸都是50MIL,是一款小方桥、贴片桥堆。MB10F的浪涌电流Ifsm为35A,漏电流(Ir)为5uA,其工作时耐温度范围为-55~150摄氏度。MB10F采用GPP芯片材质,里面有4颗芯片组成。MB10F的电性参数是:正向电流(Io)为1A,反向耐压为1000V,正向电压(VF)为1.0V,恢复时间(Trr)达到500ns,其中有4条引线。型号:MB10F封装:MBF-4(SOP-4)特性:小方桥、贴片桥堆、超薄体电性参数

    2022年8月24日
    11
  • yuicompressor java_YUI Compressor[通俗易懂]

    yuicompressor java_YUI Compressor[通俗易懂]简介根据雅虎卓越性能团队的说法,40%到60%的雅虎用户拥有空闲缓存体验,所有页面浏览量中约有20%是使用空缓存完成的(请参阅TenniTheurer在YUIBlog上的这篇文章)有关浏览器缓存使用的更多信息)。这一事实概述了保持网页尽可能轻量化的重要性。改进页面或Web应用程序的工程设计通常会带来最大的节省,而且应始终是主要策略。通过正确的设计,有许多提高性能的辅助策略,例如缩小代码,HTTP…

    2022年7月18日
    13
  • 经典永不过时的句子_网红的成功案例分析

    经典永不过时的句子_网红的成功案例分析本周给大家分享的数据分析案例是泰坦尼克号幸存者预测的项目,没记错的话,这应该是很多朋友写在简历上的项目经历。如果你目前正在找工作,自身缺少项目经历并且想要充实项目经历的话,可以考虑一下这个项目!…

    2025年8月21日
    2
  • ViewStub基本用法「建议收藏」

    ViewStub基本用法「建议收藏」在开发应用程序的时候,经常会遇到这样的情况,会在运行时动态根据条件来决定显示哪个View或某个布局。那么最通常的想法就是把可能用到的View都写在上面,先把它们的可见性都设为View.GONE,然后在代码中动态的更改它的可见性。这样的做法的优点是逻辑简单而且控制起来比较灵活。但是它的缺点就是,耗费资源。虽然把View的初始可见View.GONE但是在Inflate布局的时候View仍然会被Infl…

    2022年6月28日
    24

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号