微信小程序的事件

事件,视图层到逻辑层的一种通讯方式,或者将用户的行为返回到逻辑层,当我们在组件绑定事件之后,当我们触发事件,就会执行逻辑层绑定的事件,处理回调函数,当页面的事件触发之后
页面上元素一些额外事件,通过事件对象传递给我们的回调函数
绑定事件的实例:

通过view标签来给他绑定了一个事件,事件名clickme,在index.js中,我们绑定了一个clickme的回调函数,在回调函数内,我们打印出了事件所传入事件对象的参数
事件对象上,各个属性的一个含义;
type:触发事件的类型
timestamp:触发事件当时的时间戳
target:触发事件的根源组件,包括触发事件组件的id,类型,以及dataset自定义属性的集合
currentTarget:触发事件的当前组件,触发当前事件的id,类型,以及dataset自定义属性的集合
touches:表示我们停留在屏幕上触摸点的一个信息;
changedTouches:表示一个有变化的触摸点的信息;
detail:表示我们绑定事件所携带的数据,包括x/y到页面左上角的距离
小程序的事件模型:

小程序的事件模型分3个部分:事件捕获(自上而下)事件处理阶段(执行),事件冒泡阶段(由内到外)
currentTarget和target的区别,
currentTarget:表示当前组件,
target:根源组件:
比如,如上图,最外层绑定了一个点击事件,最里面的那层绑定了一个点击事件,当点击最里面那个事件,target代表了最外层的组件,currentTarget代表了最里面那个组件
小程序的事件

因为冒泡事件包含了捕获事件,那就只说冒泡事件
touchstart:手指按下屏幕的一个事件
touchmove:手机按下屏幕移动的一个事件
touchcancel:有来电提醒或者其他操作打断的一个事件
touchend:手指离开屏幕的一个事件
tap:手指点击屏幕,从手机点击到手指离开小于350ms的
longpress:手机点击屏幕,超过350ms的后的一个操作(推荐)不能执行tap操作
longtap:手机点击屏幕,超过350ms的后的一个操作,可以执行tap操作
transitionend:渐变动画结束后,执行的一个操作
animationstart:wxss动画开始的一个事件回调
animationiteration:wxss动画执行,迭代一次的之后的调用
animationend:wxss动画结束后的,事件回调
touchforcechange:有3d touch的ipone设备下的事件回调
捕获事件和冒泡事件的一个使用;
bind不会阻止事件冒泡;
capture-catch:可以绑定一个事件的捕获
catch:可以阻止事件冒泡或者事件捕获阶段
微信小程序的事件的更多相关文章
- 微信小程序中事件
微信小程序中事件 一.常见的事件有 类型 触发条件 最低版本 touchstart 手指触摸动作开始 touchmove 手指触摸后移动 touchcancel 手指触摸动作被打断,如来电提醒,弹窗 ...
- 微信小程序Dom事件实现
面对微信小程序,可能没有像我们平时使用JQuery那样随心所欲.本篇就是为了解决这个问题. 请合理使用工具! 细节就不说了,直接备份一个实现的案例: wxml <view class=" ...
- 微信小程序自定义事件
案例结构 首先,我还是会以案例的形式向大家讲解(这样也能方便大家更好的理解)简单介绍一下案例项目的内容(以上一章自定义组件的案例为基础)项目名称:component自定义子组件cpt父组件:logs ...
- 微信小程序(三)-事件绑定
小程序事件绑定 https://developers.weixin.qq.com/miniprogram/dev/framework/view/two-way-bindings.html 1.数据 / ...
- 微信小程序:事件绑定
小程序中绑定事件,通过bind关键字来实现.如bindinput,bindtap(绑定点击事件),bindchange等. 什么是事件 事件是视图层到逻辑层的通讯方式. 事件可以将用户的行为反馈到逻辑 ...
- 微信小程序之 -----事件
事件分类 1. 冒泡事件: 当一个组件上的事件被触发后,该事件会向父节点传递. 2. 非冒泡事件: 当一个组件上的事件被触发后,该事件不会向父节点传递. 常见的冒泡 ...
- 微信小程序-视图事件
事件 什么是事件 事件是视图层到逻辑层的通讯方式. 事件可以将用户的行为反馈到逻辑层进行处理. 事件可以绑定在组件上,当达到触发事件,就会执行逻辑层中对应的事件处理函数. 事件对象可以携带额外信息,如 ...
- 微信小程序-bindtap事件与冒泡
bindtap就是点击事件 在.wxml文件绑定: <text id='textId' data-userXxx='100' bindtap='tapMessage'>cilck here ...
- 微信小程序:冒泡事件及其阻止
事件的类别分为几种: 点击事件:tap 长按事件:longtap 触摸事件:touchstart: touchend:touchcancel:touchmove 其他:input:submit.... ...
随机推荐
- [BZOJ 2199] [USACO11JAN] 大陆议会The Continental Cowngress(2-SAT)
[BZOJ 2199] [USACO11JAN] 大陆议会The Continental Cowngress(2-SAT) 题面 题面较长,略 分析 考虑把问题转化成一个依赖性问题 我们把每只奶牛投出 ...
- Django - Xadmin (三) 分页、搜索和批量操作
Django - Xadmin (三) 分页.搜索和批量操作 分页和 ShowList 类 因为 list_view 视图函数里面代码太多,太乱,所以将其里面的用于处理表头.处理表单数据的关键代码提取 ...
- MIT 6.824学习笔记4 Lab1
现在我们准备做第一个作业Lab1啦 wjk大神也在做6.824,可以参考大神的笔记https://github.com/zzzyyyxxxmmm/MIT6824_Distribute_System P ...
- js中数组遍历常用的方法
常见的数组遍历方法,比如 for in,for of, forEach,map,filter,every,some,find,reduce等 1,普通for循环,经常用的数组遍历 var arr = ...
- VMWare15 安装 Mac OS 系统
文章目录VMWare15 安装 Mac OS 系统安装环境工具准备准备工作MAC虚拟机设置启动MAC前准备工作安装系统安装VMware Tool注意事项参考链接安装环境WIN10VMware Work ...
- zip loader
GS.ZipAssetLoader = function(audioContext) { this.audioContext = audioContext, this.objLoader = new ...
- Jupyter配置工作路径
在修改之前,C:\Users\Administrator\ .jupyter 目录下面只有一个“migrated”文件. 打开命令窗口(运行->cmd),进入python的Script目录下输入 ...
- Debug to add expression
Debug expression
- k8s存储
·几种存储类型 1)emptyDir emptyDir Volume的生命周期与Pod一致,Pod中的所有容器都可以共享Volume,它们可以指定各自的mount路径,当Pod从节点删除时,Volum ...
- python 判断一个数是整数还是小数
a=81**0.5 s=str(a).split('.') if float(s[1])==0: print('整数') else :print('小数')