微信小程序的事件

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

通过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.... ...
随机推荐
- ABI与API的区别
ABI是定义二进制级别的,两个模块的接口 比如一个二进制模块想要调用另外一个二进制模块提供的功能,它需要知道怎样通过汇编语言(即机器指令)去调用,以及怎样传递相应的参数和返回值(通过寄存器还是栈内存, ...
- 剑指offer--day04
1.1题目:变态跳台阶:一只青蛙一次可以跳上1级台阶,也可以跳上2级……它也可以跳上n级.求该青蛙跳上一个n级的台阶总共有多少种跳法. 1.2解题思路: 当n=1时,结果为1: 当n=2时,结果为2: ...
- glibc升级,解决glib版本过低的问题
Debian wheezy下的glibc版本为2.13,安装几个软件都运行不了,报以下类似错误:xxxx: /lib/i386-linux-gnu/i686/cmov/libc.so.6: versi ...
- Eureka-server配置servlet.context-path后导致Eureka-client注册到server问题
在springboot项目里配置了servlet.context-path(应用上下文路径),也称之为项目路径,该配置让项目URL后增加配置的值.如果在Eureka-server中配置该值,当然也会改 ...
- [Python3] 013 集合:你不能两次进入同一个集合
目录 0. 集合的独白 1. 集合的创建 2. 集合的特性 (1) 概述 (2) 少废话,上例子 3. 集合的遍历 4. 集合内涵 5. 集合的内置方法 6. 可供集合使用的一些方法/函数 (1) 又 ...
- UVA 12849 Mother’s Jam Puzzle( 高斯消元 )
题目: http://uva.onlinejudge.org/external/128/12849.pdf #include <bits/stdc++.h> using namespace ...
- 把java(springboot)程序打包docker镜像
前言:要在docker运行java(jar包)程序,就要把程序打包成docker镜像(以下简称镜像),可以先理解为镜像就是jar包 打包需要程序代码,java本身的打包环境(包括jdk和maven), ...
- -webkit-overflow-scrolling:touch介绍和碰到的坑
1.作用 可控制元素在移动设备有滚动回弹效果,可惯性滚动 2.适应场景 在ios移动端上,设置容器overflow-y:scroll;使容器内元素滚动时,滑动会很卡顿,使用-webkit-overfl ...
- 模块管理常规功能自己定义系统的设计与实现(15--进一步完好"省份"模块)
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/jfok/article/details/24737483 "省份"模块的进一步完 ...
- vue数据响应式的一些注意点
有关对象属性值不触发视图更新的情况: Vue 不能检测到对象属性的添加或删除,由于 Vue 会在初始化实例时对属性执行 getter/setter 转化过程,所以属性必须在 data 对象上存在才能让 ...