vue开发网页 实现实时显示当前时间

mounted () {
  // 页面加载完后显示当前时间
  this.realTime = dealWithTime(new Date())
  // 定时刷新时间
  let _this = this
  // 定时器
  this.timer = setInterval(function () {
    _this.realTime = dealWithTime(new Date()) // 修改数据date
  }, 1000)
},
methods: {
  dealWithTime (data) { 
   let formatDateTime 
   let Y = data.getFullYear() 
   let M = data.getMonth() + 1 
   let D = data.getDate() 
   let H = data.getHours() 
   let Min = data.getMinutes() 
   let S = data.getSeconds() 
   let W = data.getDay() 
   if (H < 10) { 
     H = '0' + H 
   } 
   if (Min < 10) { 
     Min = '0' + Min 
   } 
    if (S < 10) { 
     S = '0' + S 
   } 
   if (W === 1) { 
     W = '一' 
   } else if (W === 2) {
     W = '二' 
   } else if (W === 3) { 
     W = '三' 
   } else if (W === 4) {
     W = '四' 
   } else if (W === 5) { 
     W = '五' 
   } else if (W === 6) {
     W = '六' 
   } else if (W === 0) { 
     W = '日' }   
   formatDateTime = Y + '年' + M + '月' + D + '日 ' + H + ':' + Min + ':' + S + ' 星期' + W 
   return formatDateTime 
  }
},
// 注意在vue实例销毁前,清除我们的定时器。
destroyed () {
 if (this.timer) { 
   clearInterval(this.timer)
 }
}

this.realTime 即为处理后的当前时间。

猜你喜欢

转载自blog.csdn.net/u011295864/article/details/83622718