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


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游戏开发之《三国志曹操传》零部件开发(三)情景对话中仿打字机输出文字
Jan 23 Javascript
改变文件域的样式实现思路同时兼容ie、firefox
Oct 23 Javascript
javascript中打印当前的时间实现思路及代码
Dec 18 Javascript
jquery解析JSON数据示例代码
Mar 17 Javascript
JQuery 给元素绑定click事件多次执行的解决方法
Sep 09 Javascript
JavaScript使用RegExp进行正则匹配的方法
Jul 11 Javascript
jquery实现经典的淡入淡出选项卡效果代码
Sep 22 Javascript
使用JSON作为函数的参数的优缺点
Oct 27 Javascript
AngularJS实现动态编译添加到dom中的方法
Nov 04 Javascript
深入理解Vue router的部分高级用法
Aug 15 Javascript
javascript中关于类型判断的一些疑惑小结
Oct 14 Javascript
webpack4 SplitChunks实现代码分隔详解
May 23 Javascript
微信小程序之 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
php实现水仙花数的4个示例分享
2014/04/08 PHP
event.srcElement 用法笔记e.target
2009/12/18 Javascript
关于js中alert弹出窗口文本换行问题简单详细说明
2012/12/11 Javascript
使用GruntJS构建Web程序之合并压缩篇
2014/06/06 Javascript
JavaScript对象学习小结
2015/09/02 Javascript
jQuery Tags Input Plugin(添加/删除标签插件)详解
2016/06/20 Javascript
详解为Angular.js内置$http服务添加拦截器的方法
2016/12/20 Javascript
如何让你的JS代码更好看易读
2017/12/01 Javascript
vue.js过滤器+ajax实现事件监听及后台php数据交互实例
2018/05/22 Javascript
AngularJS发送异步Get/Post请求方法
2018/08/13 Javascript
JS实现的贪吃蛇游戏完整实例
2019/01/18 Javascript
解决layui追加或者动态修改的表单元素“没效果”的问题
2019/09/18 Javascript
VUE和Antv G6实现在线拓扑图编辑操作
2020/10/28 Javascript
JavaScript实现10秒后再次获取验证码
2020/12/02 Javascript
浅谈Vue开发人员的7个最好的VSCode扩展
2021/01/20 Vue.js
如何在 Vue 中使用 JSX
2021/02/14 Vue.js
python使用socket进行简单网络连接的方法
2015/04/29 Python
在Django的URLconf中使用多个视图前缀的方法
2015/07/18 Python
利用Django内置的认证视图实现用户密码重置功能详解
2017/11/24 Python
Python创建一个空的dataframe,并循环赋值的方法
2018/11/08 Python
详解Python使用Plotly绘图工具,绘制甘特图
2019/04/02 Python
Python视频编辑库MoviePy的使用
2020/04/01 Python
Python利用imshow制作自定义渐变填充柱状图(colorbar)
2020/12/10 Python
Python爬虫自动化获取华图和粉笔网站的错题(推荐)
2021/01/08 Python
python中openpyxl和xlsxwriter对Excel的操作方法
2021/03/01 Python
详解Canvas 实现炫丽的粒子运动效果(粒子生成文字)
2018/02/01 HTML / CSS
英国电子产品购物网站:TobyDeals
2018/07/30 全球购物
留学自荐信的技巧
2013/10/17 职场文书
化学教师自荐信范文
2013/12/28 职场文书
应届优秀本科大学毕业生自我鉴定
2014/01/21 职场文书
小学优秀班主任材料
2014/12/17 职场文书
中学生思想品德评语
2014/12/31 职场文书
2015年保卫科工作总结
2015/05/14 职场文书
消防宣传语大全
2015/07/13 职场文书
MySQL中几种插入和批量语句实例详解
2021/09/14 MySQL
Mysql数据库事务的脏读幻读及不可重复读详解
2022/05/30 MySQL