需求:按钮每秒钟只能点击一次。
实现:
- 使用isClick控制按钮是否可点击。
- 在按钮对应的函数中调用throttle()。
- 在throttle中判断isClick,为true,就改为false,使用定时器在一段时间后改为true,这里可以尝试消除定时器。为false,就直接return;
- 在wxml中对isClick判断,为true就调用按钮事件。
xxx.js
Page({
data: {
...
// 用于按钮节流
isClick: true
}
// 按钮触发事件
buttonClick() {
this.throttle();
...
},
// 节流
throttle() {
if(this.data.isClick) {
this.setData({isClick: false});
setTimeout(()=>{
this.setData({isClick: true})
},1000);
}else {
return;
}
}
})
xxx.wxml
<button class="submit" bindtap="{{isClick?'buttonClick':''}}">一秒钟触发一次</button>
【注1】按钮事件中最好在开始位置调用throttle()。