微信小程序 函数防抖 解决重复点击消耗性能问题实现代码


Posted in Javascript onSeptember 12, 2019

这篇文章主要介绍了微信小程序使用函数防抖解决重复点击消耗性能问题实现代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

wxml:

<view bindtap="doubleTap" bindtouchstart="touchStart" bindtouchend="touchEnd">click me</view>

 js:

// 防止重复点击
 touchStart(e) {
  this.touchStartTime = e.timeStamp;
 },
 touchEnd(e) {
 this.touchEndTime = e.timeStamp;
 },
 doubleTap(e) {
 var vm = this;
 // 控制点击事件在350ms内触发,加这层判断是为了防止长按时会触发点击事件
 if (vm.touchEndTime - vm.touchStartTime < 350) {
  // 当前点击的时间
  var currentTime = e.timeStamp;
  var lastTapTime = vm.lastTapTime;
  // 更新最后一次点击时间
  vm.lastTapTime = currentTime;
  // 如果两次点击时间在300毫秒内,则认为是双击事件
  if (currentTime - lastTapTime > 300) {
  // do something 点击事件具体执行那个业务  
  }
 }
 }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript右下角弹层及自动隐藏(自己编写)
Nov 20 Javascript
JavaScript数组Array对象增加和删除元素方法总结
Jan 20 Javascript
web前端开发upload上传头像js示例代码
Oct 22 Javascript
jQuery与JavaScript节点创建方法的对比
Nov 18 Javascript
js生成随机数方法和实例
Jan 17 Javascript
tablesorter.js表格排序使用方法(支持中文排序)
Feb 10 Javascript
vue使用stompjs实现mqtt消息推送通知
Jun 22 Javascript
解决vue 格式化银行卡(信用卡)每4位一个符号隔断的问题
Sep 14 Javascript
原生JS forEach()和map()遍历的区别、兼容写法及jQuery $.each、$.map遍历操作
Feb 27 jQuery
Django+Vue实现WebSocket连接的示例代码
May 28 Javascript
微信小程序自定义导航栏(模板化)
Nov 15 Javascript
jquery轮播图插件使用方法详解
Jul 31 jQuery
微信小程序之 catalog 切换实现解析
Sep 12 #Javascript
layui实现checkbox的目录树tree的例子
Sep 12 #Javascript
layui表单提交到后台自动封装到实体类的方法
Sep 12 #Javascript
使用flow来规范javascript的变量类型
Sep 12 #Javascript
LayUI数据接口返回实体封装的例子
Sep 12 #Javascript
浅谈layui 数据表格前后台传值的问题
Sep 12 #Javascript
layui框架与SSM前后台交互的方法
Sep 12 #Javascript
You might like
ThinkPHP实现批量删除数据的代码实例
2014/07/02 PHP
PHP+apc+ajax实现的ajax_upload上传进度条代码
2016/01/25 PHP
php注册系统和使用Xajax即时验证用户名是否被占用
2017/08/31 PHP
用javascript实现的仿Flash广告图片轮换效果
2007/04/24 Javascript
javascript 计算两个整数的百分比值
2009/12/26 Javascript
利用js实现选项卡的特别效果的实例
2013/03/03 Javascript
js几秒以后倒计时跳转示例
2013/12/26 Javascript
JavaScript实现自动弹出窗口并自动关闭窗口的方法
2015/08/06 Javascript
详解angular笔记路由之angular-router
2017/09/12 Javascript
纯html+css+javascript实现楼层跳跃式的页面布局(实例代码)
2017/10/25 Javascript
vue获取当前点击的元素并传值的实例
2018/03/09 Javascript
jQuery实现form表单序列化转换为json对象功能示例
2018/05/23 jQuery
详解Vue 换肤方案验证
2019/08/28 Javascript
js与jquery获取input输入框中的值实例讲解
2020/02/27 jQuery
用vite搭建vue3应用的实现方法
2021/02/22 Vue.js
Python入门学习指南分享
2018/04/11 Python
对numpy的array和python中自带的list之间相互转化详解
2018/04/13 Python
Tensorflow卷积神经网络实例
2018/05/24 Python
Python二叉树定义与遍历方法实例分析
2018/05/25 Python
django ajax json的实例代码
2018/05/29 Python
在PyCharm下使用 ipython 交互式编程的方法
2019/01/17 Python
pandas读取CSV文件时查看修改各列的数据类型格式
2019/07/07 Python
Python实现ATM系统
2020/02/17 Python
CSS3的文字阴影—text-shadow的使用方法
2012/12/25 HTML / CSS
梵蒂冈和罗马卡:Omnia Card Pass
2018/02/10 全球购物
重新定义牛仔布,100美元以下:Warp + Weft
2018/07/25 全球购物
意大利在线药房:Farmacia Loreto Gallo
2019/08/09 全球购物
毕业生的自我鉴定
2013/10/29 职场文书
你的创业计划书怎样才能打动风投
2014/02/06 职场文书
党员反对四风思想汇报范文
2014/10/25 职场文书
2015年社区平安建设工作总结
2015/05/13 职场文书
心术观后感
2015/06/11 职场文书
工程款催款函
2015/06/24 职场文书
大学生读书笔记大全
2015/07/01 职场文书
2019个人工作自我评价范文(3篇)
2019/09/19 职场文书
Python开发工具Pycharm的安装以及使用步骤总结
2021/06/24 Python