尚硅谷的vue旅程14-vue中的过滤器filter()--格式化时间

用过滤器格式化时间:
	理解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>
上一篇:给指定日期加上固定时间


下一篇:TPL 之七 TDF中的负载均衡