微信小程序之按钮短时间内被多次点击问题

做项目的时候碰到这个问题,按钮的功能做好了,但是总会出现按的太快,出现不可预料的问题。

解决方法之一:借助函数节流来实现

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、完工,去试试效果吧!

相关推荐
是大刚啊6 小时前
微信小程序原生车牌输入器
微信小程序·小程序·tdesign·车牌号·车牌输入
韩立学长10 小时前
【开题答辩实录分享】以《宠物领养微信小程序》为例进行答辩实录分享
微信小程序·宠物
玖月晴空11 小时前
Uniapp 速查文档
前端·微信小程序·uni-app
2501_9159184112 小时前
App 上架苹果商店全流程详解 从开发者账号申请到开心上架(Appuploader)跨平台免 Mac 上传实战指南
macos·ios·小程序·uni-app·objective-c·cocoa·iphone
说私域13 小时前
定制开发开源AI智能名片S2B2C商城小程序中的羊群效应应用研究
人工智能·小程序
一匹电信狗13 小时前
【C++】红黑树详解(2w字详解)
服务器·c++·算法·leetcode·小程序·stl·visual studio
CsharpDev-奶豆哥13 小时前
微信小程序通过主键ID修改json数据的技术分享
微信小程序·小程序·json
汤姆yu14 小时前
基于微信小程序的防诈骗管理系统
微信小程序·小程序·防诈骗管理
2501_9160074714 小时前
从零开始学习iOS App开发:Xcode、Swift和发布到App Store完整教程
android·学习·ios·小程序·uni-app·iphone·xcode
2501_9160088915 小时前
前端工具全景实战指南,从开发到调试的效率闭环
android·前端·小程序·https·uni-app·iphone·webview