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

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

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

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

相关推荐
说私域10 小时前
O2O电商变现:线上线下相互导流——基于定制开发开源AI智能名片S2B2C商城小程序的研究
人工智能·小程序·开源·零售
说私域12 小时前
基于开源AI智能名片链动2+1模式S2B2C商城小程序源码的去中心化商业扩散研究
人工智能·小程序·开源·去中心化·零售
不爱吃饭爱吃菜15 小时前
uniapp微信小程序一键授权登录
前端·javascript·vue.js·微信小程序·uni-app
mon_star°1 天前
微信答题小程序支持latex公式显示解决方案
微信·小程序
MaCa .BaKa1 天前
38-日语学习小程序
java·vue.js·spring boot·学习·mysql·小程序·maven
HouGISer1 天前
副业小程序YUERGS,从开发到变现
前端·小程序
橘子海全栈攻城狮2 天前
【源码+文档+调试讲解】党员之家服务系统小程序1
java·开发语言·spring boot·后端·小程序·旅游
好好的哦2 天前
uni-app小程序登录后…
小程序·uni-app
h_65432102 天前
微信小程序点击按钮跳转链接并显示
微信小程序·小程序