
1:data中定義? ?time: Date.parse(new Date()) //拿到時間戳
2: vue filters過濾器 處理數(shù)據(jù)
filters: {
? ? ? // value是時間戳
? ? ? formatDate: function(value) {
? ? ? ? // console.log('我是過濾器的value',new Date(value))
? ? ? ? let date = new Date(value);
? ? ? ? let y = date.getFullYear();
? ? ? ? let MM = date.getMonth() + 1;
? ? ? ? MM = MM < 10 ? '0' + MM : MM;
? ? ? ? let d = date.getDate();
? ? ? ? d = d < 10 ? '0' + d : d;
? ? ? ? let h = date.getHours();
? ? ? ? h = h < 10 ? '0' + h : h;
? ? ? ? let m = date.getMinutes();
? ? ? ? m = m < 10 ? '0' + m : m;
? ? ? ? let s = date.getSeconds();
? ? ? ? s = s < 10 ? '0' + s : s;
? ? ? ? return h + ':' + m + ':' + s;
? ? ? }
? ? },
3:mounted 和?beforeDestroy 分別處理
mounted() {
? ? ? this.datetime = setInterval(() => {
? ? ? ? this.time = Date.parse(new Date());
? ? ? }, 1000);
? ? },
? ? beforeDestroy() {
? ? ? // if (this.datetime) {
? ? ? clearInterval(this.datetime); // 在Vue實例銷毀前,清除我們的定時器
? ? ? // }
? ? },
?4:標(biāo)簽中使用
<div class="date-time">{{ time | formatDate }}</div>