52 lines
1.1 KiB
Vue
52 lines
1.1 KiB
Vue
|
<template>
|
||
|
|
<view>
|
||
|
|
{{cdTime}}
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
cdTime:""
|
||
|
|
}
|
||
|
|
},
|
||
|
|
onLoad() {
|
||
|
|
let downTime = 5 //倒计时5分钟
|
||
|
|
let t = (new Date()).getTime() //当前时间戳
|
||
|
|
let dt = t + (downTime * 60) * 1000 //加了5分钟后的时间戳
|
||
|
|
let timer = setInterval(() => {
|
||
|
|
this.cdTime = countDown(dt); //cdtime为显示在页面的时间
|
||
|
|
if (countDown(dt) == 0) {
|
||
|
|
clearInterval(timer)
|
||
|
|
}
|
||
|
|
}, 1000)
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
countDown(dt) {
|
||
|
|
let nowTime = (new Date()).getTime(); //实时时间戳
|
||
|
|
let times = (dt - nowTime) / 1000; //加分钟后的时间戳-实时时间戳
|
||
|
|
let minuter
|
||
|
|
let second
|
||
|
|
if (times >= 0) {
|
||
|
|
minuter = Math.floor(times / 60 % 60); //计算分钟
|
||
|
|
second = Math.floor(times % 60); //计算秒钟
|
||
|
|
if (minuter == 0 && second == 0) {
|
||
|
|
return 0
|
||
|
|
}
|
||
|
|
if (second.toString().split('').length < 2) { //秒补0
|
||
|
|
second = "0" + second
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
return 0
|
||
|
|
}
|
||
|
|
return "0" + minuter + ":" + second; //分补0并返回
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
|
||
|
|
</style>
|