日期倒计时
场景一:
代码:
可复制代码:
data() {
return {
match_date: '',
countDownList: '00天00时00分00秒'
}
timeFormat(param) {
return param < 10 ? '0' + param : param
},
countDown(it) {
var interval = setInterval(() => {
// 获取当前时间,同时得到活动结束时间数组
let newTime = new Date().getTime() // 对结束时间进行处理渲染到页面
let endTime = new Date(it).getTime()
let obj = null // 如果活动未结束,对时间进行处理
if (endTime - newTime > 0) {
let time = (endTime - newTime) / 1000 // 获取天、时、分、秒
let day = parseInt(time / (60 * 60 * 24))
let hou = parseInt((time % (60 * 60 * 24)) / 3600)
let min = parseInt(((time % (60 * 60 * 24)) % 3600) / 60)
let sec = parseInt(((time % (60 * 60 * 24)) % 3600) % 60)
obj = {
day: this.timeFormat(day),
hou: this.timeFormat(hou),
min: this.timeFormat(min),
sec: this.timeFormat(sec)
}
} else {
// 活动已结束,全部设置为'00'
obj = {
day: '00',
hou: '00',
min: '00',
sec: '00'
}
clearInterval(interval)
}
this.countDownList =
obj.day + ' 天 ' + obj.hou + ' 时 ' + obj.min + ' 分 ' + obj.sec + ' 秒 '
}, 1000)
},
请求到 match_date 后进行调用
loadDetailData() {
this.$apis.game.getDetailData({ activity_id: this.activity_id }).then(res => {
console.log(res)
this.match_name = res.data.name
this.match_date = this.formatDate(res.data.date)
this.$nextTick(() => {
this.countDown(this.match_date)
})
})
},
秒 倒计时 (10s 60s )
场景一 : pc
场景二 : 移动端
setCountdown() {
this.countdown = 10
const timer = setInterval(() => {
this.countdown--
if (this.countdown === 0) {
clearInterval(timer)
}
}, 1000)
},