做项目的时候碰到这个问题,按钮的功能做好了,但是总会出现按的太快,出现不可预料的问题。
解决方法之一:借助函数节流来实现
1、创建一个工具包(throttle.js),通过封装一个高阶函数,对函数的执行频率进行限制。:
function throttle(fn, gapTime) {
let _lastTime = null;
return function() {
let _nowTime = +new Date();
if (_nowTime - _lastTime > gapTime || !_lastTime) {
fn.apply(this, arguments);
_lastTime = _nowTime;
}
}
}
module.exports = {
throttle
}
2、在我们的按钮响应函数(handleClick)中使用:
const { throttle } = require('../../utils/throttle.js');
Page({
handleClick: throttle(function() {
// 处理点击逻辑
}, 2000) // 2秒内只执行一次
});
3、完工,去试试效果吧!