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

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

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

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

相关推荐
正在走向自律1 小时前
用豆包Seed Evolving打造全功能【AI智能记账】小程序,开源可落地
人工智能·小程序·开源·智能记账
小羊Yveesss1 天前
模板建站哪个平台好?模板数量之外还要比较编辑与SEO能力
大数据·人工智能·小程序
2501_916007471 天前
深入理解HTTPS对称与非对称加密机制及Charles抓包实践
网络协议·http·ios·小程序·https·uni-app·iphone
郑州光合科技余经理1 天前
家政O2O平台解析:从0搭建上门预约小程序解决方案
android·java·开发语言·前端·小程序·架构·php
维双云1 天前
小程序商城制作一个需要多少钱?2026报价明细与成本拆解
小程序
郑州光合科技余经理1 天前
家政预约小程序后端源码深度剖析:支付回调实战
java·开发语言·前端·git·小程序·架构·php
电商API_180079052471 天前
导购比价小程序场景|京东联盟商品详情对接方案|多规格图文拉取技术实操
网络·小程序·网络爬虫
北极糊的狐1 天前
钉钉小程序 Git 版本管理完整流程
git·小程序·钉钉
码农学院1 天前
微信小程序云开发实战:扫码点餐系统的高并发订单处理与外卖接单架构
微信小程序·架构·notepad++
凡泰AI2 天前
如何借助MCP打通企业APP内部服务:从统一调用到小程序承接
小程序·uni-app·app·mpaas·mcp·小程序容器