调用setInterval后无法清除？
我写了一个倒计时函数，但遇到了设置一个一分钟的倒计时，明明结束后已经00:00了，自动又从59分59秒重新开始倒计时
刚开始学小程序，求大佬指正，下面附上代码：
// pages/exercise/exercise.js
Page({
/**
* 页面的初始数据
*/
data: {
showSlider:false,
showCountDown:false,
remainTimeText:'',
hourCountdown: 0,
countdown: "00:00"
},
//打开计时滑动器
showPicker: function() {
this.setData({
showSlider: true,
showCountDown: false
});
},
//“取消”按钮的隐藏计时滑动器
CloseSlider(){
let countdown = this.data.countdown;
if(countdown !== 0){
this.setData({
showSlider:false,
showCountDown:true
})
}
else{
this.setData({
showSlider:false
})
}
},
//“确认”按钮的隐藏计时滑动器
hideSlider() {
const hourCountdown = this.data.hourCountdown;
// 判断是否存在倒计时，存在则清除
if (this.interval) {
clearInterval(this.interval);
}
this.setData({
showSlider: false,
showCountDown: true
});
// 更新倒计时初始时间
let countdown = `${hourCountdown.toString().padStart(2, "0")}:00`;
this.setData({
countdown: countdown
});
// 调用倒计时函数
this.countdownFunc();
},
//设置运动时长
sliderChange(e) {
this.setData({
hourCountdown: e.detail.value,
});
},
// 倒计时执行函数
countdownFunc() {
let hourCountdown = this.data.hourCountdown;
let countdown = this.data.countdown.split(":");
let minutes = Number(countdown[0]);
let seconds = Number(countdown[1]);
this.interval = setInterval(() => {
if (hourCountdown > 0 || minutes > 0 || seconds > 0) {
if (seconds === 0) {
if (minutes > 0) {
minutes -= 1;
seconds = 59;
} else if (hourCountdown > 0) {
hourCountdown -= 1;
minutes = 59;
seconds = 59;
}
} else {
seconds -= 1;
}
let formattedTime = `${minutes.toString().padStart(2, "0")}:${seconds.toString().padStart(2, "0")}`;
this.setData({
hourCountdown: hourCountdown,
countdown: formattedTime
});
} else {
this.setData({
hourCountdown: 0,
showCountDown: false
});
}
}, 1000);
// 判断是不是无倒计时，如果是，则清除倒计时
if (this.data.hourCountdown === 0) {
clearInterval(this.interval);
}
},
//自主加分函数
pluspoint(){
wx.showModal({
title: '请输入数字',
showCancel: true,
cancelText: '取消',
confirmText: '确定',
editable:true,
placeholderText:'1min = 1 分',
success: function (res) {
if (res.confirm) {
var input_value = res.content; // 获取用户输入的数据
if (!isNaN(input_value)) {
console.log(input_value); // 打印用户输入的数字
} else {
wx.showToast({
title: '请输入正确的数字',
icon: 'none'
})
}
} else if (res.cancel) {
console.log('用户点击取消');
}
},
fail: function (res) {
console.log('弹窗失败');
}
})
},
//跳转兑换页面
gotoexchange(e){
wx.navigateTo({
url: '/pages/exchange/exchange',
})
},
//将照片发送至邮箱//如果没有服务器或者使用云开发，好像达不到这个功能
undeveloped(){
wx.showToast({
title: '该功能没钱开发',
icon: 'error',
mask: true
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
//获取全局point
let point = getApp().globalData.point;
this.setData({
point : point
})
this.countdownFunc();
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
let point = wx.getStorageSync('point')
this.setData({
point:point
})
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
上到达底部() {
},
/**
* 用户点击右上角分享
*/
在分享应用消息() {
}
})
