欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

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

程序员文章站 2022-05-15 08:23:00
本文实例为大家分享了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 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格式化时间过滤器详解整合,希望对大家有所帮助