业务场景:自定义组件弹窗在组件中使用定时器
组件JS中写
// 在组件在视图层布局完成后执行
ready(){
console.log("在组件在视图层布局完成后执行")
// let that = this
this.observeOneParameter(this.data, "modalHidden", this.watch.bind(this))
},
/**
* 组件的方法列表
*/
methods: {
observeOneParameter(obj, key, watchFun) {
var val = obj[key]
Object.defineProperty(obj, key, {
configurable: true,
enumerable: true,
set: function (value) {
val = value;
watchFun(value, val)
},
get: function () {
return val;
}
})
},
watch(newValue) {
if (!newValue) {
this.creatGetCarTimer()
} else {
this.destroyTimer()
}
},
// 创建定时器
creatGetCarTimer() {
let that = this
if (this.data.timeobj == null) {
console.log("创建定时器")
let timeObjNew = setInterval(() => {
that.pressIfMins()
}, 1000)
this.setData({
timeobj: timeObjNew
})
}
},
pressIfMins(){
if (this.data.modalType != "lockCarTime"){
this.destroyTimer()
}
this.data.getCarTiem --
let timeStr = timeOutFormat(this.data.getCarTiem)
let timeArr = timeStr.split("-")
this.setData({
min: timeArr[0],
second: timeArr[1]
})
if (this.data.getCarTiem == 0){
this.destroyTimer()
this.setData({
modalHidden: true,
})
}
console.log(this.data.getCarTiem)
},
}
里面倒计时的timeOutFormat在之前的博客中有写