当前位置:编程学习 > uniapp >>

uni-app - javaScript - vue2 正计时计时器

正计时 
1.在data里面定义

     data() {
return {
time: '00:00:00',
timer: '',
hour: 0,
minutes: 0,
seconds: 0
}
},
'
运行运行
2.页面按钮

<template>
<view>
<button @click="begin">开始计时{{time}}</button>
<button @click="pause">暂停</button>
</view>
</template>
'
运行运行
3.开始计时

           // 开始计时
begin() {
this.timer = setInterval(this.startTimer, 1000);
},
startTimer() {
this.seconds += 1;
if (this.seconds >= 60) {
this.seconds = 0;
this.minutes = this.minutes + 1;
}
if (this.minutes >= 60) {
this.minutes = 0;
this.hour = this.hour + 1;
}
this.time = (this.hour < 10 ? '0' + this.hour : this.hour) + ':' + (this.minutes < 10 ? '0' + this
.minutes :
this.minutes) + ':' + (this.seconds < 10 ? '0' + this.seconds : this.seconds);
},
'
运行运行
4.暂停计时

//暂停计时
pause() {
if (this.timer) {
clearInterval(this.timer);
}
},
CopyRight © 2022 站长资源库 编程知识问答 zzzyk.com All Rights Reserved
部分文章来自网络,