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

这篇文章主要介绍了vue格式化时间过滤器,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

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

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="https://unpkg.com/vue"></script> </head> <body> <div> <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格式化时间过滤器详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/76b6604b96c71810c851e58af6e7062d.html