Filtro Vue Journey 14 de Shang Silicon Valley en filtro Vue () - tiempo de formateo

用过滤器格式化时间:
	理解Vue.filter()函数的使用方法
	可以在bootCDN中引入 moment.js的库
	参考moment.js文档中 解析部分  来指定格式化数据的格式

<div id="demo">
	<p>未格式化的完整版时间: {
   
   {date}}</p>
	<!-- 格式化数据时，要注意此处的格式  下一行中{
    
    {需要格式化的数据  |  过滤器名称 }}-->
	<P>完整版时间: {
   
   {date | dateFormat}}</P>
	<p>年月日:{
   
   {date | dateFormat("YYYY-MM-DD")}}</p>
	<p>时分秒:{
   
   {date | dateFormat("HH:mm:ss")}}</p>
</div>

<script src="../js/vue.js" type="text/javascript" charset="utf-8"></script>
<!-- 从bootCDN中导入插件库 -->
<script src="https://cdn.bootcdn.net/ajax/libs/moment.js/2.29.1/moment.js"></script>
<script type="text/javascript">
	//过滤器--格式化时间
	//Vue.filter("过滤器名称",过滤函数)
	Vue.filter("dateFormat",function(value,format='YYYY-MM-DD  HH:mm:ss'){
     
     //p标签中的date参数会传到value参数中, 指定格式回传到format参数中
		//参考moment.js文档
		let newValue = moment(value).format(format);//若指定格式format为空，则按照 || 后面的格式进行格式化数据
		//返回过滤之后的值
		return newValue;
	})
	
	new Vue({
     
     
		el:"#demo",
		data:{
     
     
			date: new Date()
		}
	})
</script>