Vue使用filter过滤器格式化时间的两种方式

通常用new Date()实例对象时，默认调用的是toString()方法，返回的是一个字符串，

需要把时间统一格式化为自己想要的格式，在vue中为我们提供了一个filter过滤器，

去格式化自己想要的时间格式，本人用过两种方式去格式化时间，下面请看代码:

(仅供参考)

第一种格式化方法：

       第一种方法比较简单，主要是导入了一个moment.js插件，里面封装了格式化时间的方法

     先看代码：

   

     
	    
		
	 
	 
	    

		    
显示格式化时间
			
格式化前：{{date}}
			
格式化后：{{date | dateStr}}
			
只显示年月日：{{date | dateStr('YYYY-MM-DD')}}
			
只显示时分秒：{{date | dateStr('HH:mm:ss')}}
        
        
        
        
	 

      效果图：

     

      插件的链接：https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.js

      插件的官网：http://momentjs.com  可以去官网查看下具体用法

     

第二种格式化方法:

       第二种方法比较复杂些，不过大概的原理都差不多，格式化的结果也和第一种是相同的，代码如下：

     

     
	    
		
	 
	 
	    

		    
显示格式化时间
			
格式化前：{{date}}
			
格式化后：{{date | dateFormat}}
			
只显示年月日：{{date | dateFormat('YYYY-MM-DD')}}
			
只显示时分秒：{{date | dateFormat('HH:mm:ss')}}
        
	    
        
	 

         最后的结果和第一种相同。

大家如果有更好的意见欢迎提出～～