微信小程序的事件

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

通过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.... ...
随机推荐
- java锁的概念
在学习或者使用Java的过程中进程会遇到各种各样的锁的概念:公平锁.非公平锁.自旋锁.可重入锁.偏向锁.轻量级锁.重量级锁.读写锁.互斥锁等待.这里整理了Java中的各种锁,若有不足之处希望大家在下方 ...
- [19/05/06-星期一] JDBC(Java DataBase Connectivity,java数据库连接)_基本知识
一.概念 JDBC(Java Database Connectivity)为java开发者使用数据库提供了统一的编程接口,它由一组java类和接口组成.是java程序与数据库系统通信的标准API. J ...
- c3p0连接池快速入门
为什么要使用连接池,这些基本也不用说那么多 以下为快速入门案例 包目录结构 配置文件c3p0-config.xml <c3p0-config> <!-- 默认配置,如果没有指定自己的 ...
- Java-JavaMail邮件开发(1)Java Mail
1.仅使用Java Mail 使用163邮箱作为代理服务器: 引入依赖: <dependency> <groupId>com.sun.mail</groupId> ...
- [Codeforces 1201D]Treasure Hunting(DP)
[Codeforces 1201D]Treasure Hunting(DP) 题面 有一个n*m的方格,方格上有k个宝藏,一个人从(1,1)出发,可以向左或者向右走,但不能向下走.给出q个列,在这些列 ...
- 重载与重写、多态——java
方法的重写(Overriding)和重载(Overloading)是java多态性的不同表现,重写是父类与子类之间多态性的一种表现,重载可以理解成多态的具体表现形式. (1)方法重载是一个类中定义了多 ...
- 你浏览器的书签栏还够用么? - 程序员学点xx 特辑
lluxury 运维开发时间 为什么会想到这个话题,是因为最近看到的一条广告:注册 xx 送2048GB资料.yann 暗自感慨:"都9012年了,还有人分享家里的祖传硬盘".2T ...
- 15、前端知识点--MVVM
MVVM模式的理解 MVVM模式里面,核心是数据. 各种前端框架,最核心的说就是保持了数据与视图的同步. 数据驱动思想:数据驱动视图. Vue不建议手动操作DOM. 以前是指令操作DOM,其实本质上底 ...
- vue css中scoped
1.什么是scoped vue组件中,在style标签中有一个属性,叫做scoped.当此标签拥有scoped属性的时候,该组件下的css样式只适用于本组件,而不会影响全局组件.这其实也相当于样式的模 ...
- IC设计:CMOS器件及其电路
作为一个微电子专业的IC learner,这个学期也有一门课:<微电子器件>,今天我就来聊聊基本的器件:CMOS器件及其电路.在后面会聊聊锁存器和触发器. ·MOS晶体管结构与工作原理简述 ...