vue中格式化时间过滤器代码实例

2024-05-06 15:40:30

字体：大中小

来源：转载

供稿：网友

本文实例为大家分享了vue格式化时间过滤器的具体代码，供大家参考，具体内容如下

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Document</title><script src="https://unpkg.com/vue"></script></head><body><div id="app"><div> {{ message | formatTime('YMD')}}</div><div>{{ message | formatTime('YMDHMS')}}</div>   <div>    {{ message | formatTime('HMS')}}   </div>    <div>    {{ message | formatTime('YM')}}   </div>    </div><script>//元素的补零计算function addZero(val){ if(val < 10){  return "0" +val; }else{  return val; }};console.log(addZero(9))//实现vue中的过滤器功能  先定义过滤器 在使用        value是过滤器前面的值，type是过滤器中定义的字段Vue.filter("formatTime",function(value,type){var dataTime="";var data = new Date();               data.setTime(value);      var year   =  data.getFullYear();               var month  =  addZero(data.getMonth() + 1);               var day    =  addZero(data.getDate());              var hour   =  addZero(data.getHours());var minute =  addZero(data.getMinutes());var second =  addZero(data.getSeconds());if(type == "YMD"){dataTime =  year + "-"+ month + "-" + day;}else if(type == "YMDHMS"){dataTime = year + "-"+month + "-" + day + " " +hour+ ":"+minute+":" +second;}else if(type == "HMS"){dataTime = hour+":" + minute+":" + second;}else if(type == "YM"){dataTime = year + "-" + month;}return dataTime;//将格式化后的字符串输出到前端显示});var app = new Vue({ el: '#app', data: {   message: '1501068985877' }         });</script></body></html>

以上所述是小编给大家介绍的vue格式化时间过滤器详解整合，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对错新站长站网站的支持！

上一篇：详解JavaScript的内存空间、赋值和深浅拷贝

下一篇：怎样使你的 JavaScript 代码简单易读（推荐）