使用vue怎么将后台数据时间戳转换成日期格式

  介绍

这篇文章主要为大家详细介绍了使用vue怎么将后台数据时间戳转换成日期格式,文中示例代码介绍的非常详细,具有一定的参考价值,发现的小伙伴们可以参考一下:

vue的优点

vue具体轻量级框架,简单易学,双向数据绑定,组件化,数据和结构的分离,虚拟DOM,运行速度快等优势,vue中页面使用的是局部刷新,不用每次跳转页面都要请求所有数据和DOM,可以大大提升访问速度和用户体验。

<强>前言

在项目中,经常会有后台返回一个时间戳,页面展示用的却是日期格式的情况
不同组件多次使用的话,那么建议在src下新建一个常见的文件夹,创建日期。js文件,方便多次复用

在组件中使用

& lt; template>   ,& lt; div>   & lt;才能p> {{| date1  formatDate}} & lt;/p>   & lt;才能p> {{date1  |, formatDate2}} & lt;/p>   & lt;才能p> {{date1  |, formatDate3}} & lt;/p>   ,& lt;/div>   & lt;/template>   & lt; script>   {,import  formatDate },得到& # 39;@/共同/date.js& # 39;,//,在组件中引用date.js   ,export  default  {   数据才能(),{   ,,return  {   ,,,date1: 1646461131351   ,,}   ,,},   ,,过滤器:{   ,,/*   ,,,时间格式自定义,只需把字符串里面的改成自己所需的格式   ,,*/,   ,,formatDate(时间),{   ,,,var  date =, new 日期(时间);   ,,,return  formatDate(日期,& # 39;yyyy.MM.dd& # 39;),,   ,,},   ,,formatDate2(时间),{   ,,,var  date =, new 日期(时间);   ,,,return  formatDate(日期,& # 39;hh: mm: ss # 39;),,   ,,},   ,,formatDate3(时间),{   ,,,var  date =, new 日期(时间);   ,,,return  formatDate(日期,& # 39;yyyy年MM月dd日,hh: MM: ss # 39;),,   ,,}   ,,}   ,}   & lt;/script>

效果图

使用vue怎么将后台数据时间戳转换成日期格式

日期。js源码

export  function  formatDate(日期,fmt), {   ,if  (/(y +)/test (fmt)), {   fmt 才能=,fmt.replace (RegExp, 1美元,(date.getFullYear (), +, & # 39; & # 39;) .substr(4,安康;RegExp。1.美元长度));   ,}   ,let  o =, {   & # 39;才能M + & # 39;:, date.getMonth (), +, - 1,   & # 39;才能d + & # 39;:, date.getDate (),   & # 39;才能h + & # 39;:, date.getHours (),   & # 39;才能m + & # 39;:, date.getMinutes (),   & # 39;才能s + & # 39;:, date.getSeconds ()   ,};   ,for  (let  k 拷贝o), {   if 才能;(new 正则表达式(($ {k})) test (fmt)), {   ,,let  str =, o [k], +, & # 39; & # 39;;   ,,fmt =, fmt.replace (RegExp, 1美元,(RegExp。1.美元length ===, 1), ?, str :, padLeftZero (str));   ,,}   ,}   ,return  fmt;   };      function  padLeftZero (str), {   ,return  (& # 39; 00 & # 39;, +, str) .substr (str.length);   };

以上就是小编为大家收集整理的使用vue怎么将后台数据时间戳转换成日期格式,如何觉得网站的内容还不错,欢迎将网站推荐给身边好友。

使用vue怎么将后台数据时间戳转换成日期格式