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


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在IE和FireFox中的不同表现简析
Dec 03 Javascript
jQuery快速上手:写jQuery与直接写JS的区别详细解析
Aug 26 Javascript
使用jQuery中的when实现多个AJAX请求对应单个回调的例子分享
Apr 23 Javascript
用js一次改变多个input的readonly属性值的方法
Jun 11 Javascript
jQuery视差滚动效果网页实现方法经验总结
Sep 29 Javascript
jQuery插件zTree实现清空选中第一个节点所有子节点的方法
Mar 08 Javascript
js模拟支付宝密码输入框
Apr 11 Javascript
为JQuery EasyUI 表单组件增加焦点切换功能的方法
Apr 13 jQuery
详谈构造函数加括号与不加括号的区别
Oct 26 Javascript
微信小程序以ssm做后台开发的实现示例
Apr 08 Javascript
Vue中keep-alive的两种应用方式
Jul 15 Javascript
JavaScript前端面试扁平数据转tree与tree数据扁平化
Jun 14 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
用IE远程创建Mysql数据库的简易程序
2006/10/09 PHP
thinkphp使用phpmailer发送邮件的方法
2014/11/24 PHP
Yii2框架引用bootstrap中日期插件yii2-date-picker的方法
2016/01/09 PHP
高质量PHP代码的50个实用技巧必备(上)
2016/01/22 PHP
学习thinkphp5.0验证类使用方法
2017/11/16 PHP
Javascript 匿名函数及其代码模式原理
2010/03/19 Javascript
Knockoutjs的环境搭建教程
2012/11/26 Javascript
jQuery实现复选框成对选择及对应取消的方法
2015/03/03 Javascript
JavaScript中的方法重载实例
2015/03/16 Javascript
JS原型、原型链深入理解
2016/02/27 Javascript
js纯数字逐一停止显示效果的实现代码
2016/03/16 Javascript
jquery 抽奖小程序实现代码
2016/10/12 Javascript
微信小程序 获取微信OpenId详解及实例代码
2016/10/31 Javascript
Vuex之理解Mutations的用法实例
2017/04/19 Javascript
AngularJS+bootstrap实现动态选择商品功能示例
2017/05/17 Javascript
jQuery移动端跑马灯抽奖特效升级版(抽奖概率固定)实现方法
2019/01/18 jQuery
小程序的上传文件接口的注意要点解析
2019/09/17 Javascript
Vue实现简单的跑马灯
2020/05/25 Javascript
JS+Canvas实现五子棋游戏
2020/08/26 Javascript
[06:45]DOTA2卡尔工作室 英雄介绍幻影长矛手篇
2013/07/12 DOTA
[57:16]2014 DOTA2华西杯精英邀请赛 5 25 LGD VS VG第二场
2014/05/26 DOTA
[55:35]VGJ.S vs Mski Supermajor小组赛C组 BO3 第二场 6.3
2018/06/04 DOTA
[01:07:19]DOTA2-DPC中国联赛 正赛 CDEC vs XG BO3 第一场 1月19日
2021/03/11 DOTA
python读取json文件并将数据插入到mongodb的方法
2015/03/23 Python
Pycharm学习教程(5) Python快捷键相关设置
2017/05/03 Python
Python实现PS图像调整之对比度调整功能示例
2018/01/26 Python
python实现三次样条插值
2018/12/17 Python
Python常用爬虫代码总结方便查询
2019/02/25 Python
python GUI库图形界面开发之PyQt5简单绘图板实例与代码分析
2020/03/08 Python
python线性插值解析
2020/07/05 Python
c++工程师面试问题
2013/08/04 面试题
社会学专业求职信
2014/02/24 职场文书
离婚协议书范文2014
2014/10/16 职场文书
微观世界观后感
2015/06/10 职场文书
2016年大学生就业指导课心得体会
2015/10/09 职场文书
总结Python连接CS2000的详细步骤
2021/06/23 Python