小程序事件处理

事件

事件就是用户到界面(视图)的交互行为,移动端常见的交互行为(触屏,触摸移动,长按,键盘,多点触控,摇一摇,各类状态事件,...,重按)

事件绑定

在小程序中绑定事件使用bind(不会阻止冒泡),catch capture-bind使用捕获、capture-catch关键字，后者将中断捕获阶段和取消冒泡阶段 //bind事件绑定不会阻止冒泡事件向上冒泡，catch事件绑定能够阻止冒泡事件向上冒泡。 两种写法 bind:tap bindtap catch:tap catchtap 例如:<view bindTap='{{clickFn}}'></view> **在page.js中** Page({ clickFn(event){ console.log(event) } })

事件分类

事件分为冒泡事件和非冒泡事件
    1.冒泡事件：当一个组件上的事件被触发后，该事件会向父节点传递。(点击、移动、触摸打断touchcancel,tap轻按,longpress长按,longtap长按,transitionstart,animationiteration迭代结束,动画监听) 2.非冒泡事件：当一个组件上的事件被触发后，该事件不会向父节点传递。(例如:表单相关事件、加载相关事件)

交互事件

触摸  touchstart
移动  touchmove
打断  touchcancel
离开  touchend
轻触  tap
长按(超过350ms)  longtap  longpress
重按(3D Touch 设备) touchforcechange

**监听事件**
transitionend	会在 WXSS transition 或 wx.createAnimation 动画结束后触发 animationstart 会在一个 WXSS animation 动画开始时触发 animationiteration 会在一个 WXSS animation 一次迭代结束时触发 animationend 会在一个 WXSS animation 动画完成时触发 touchforcechange 在支持 3D Touch 的 iPhone 设备，重按时会触发

Event对象

{
 type:事件类型,  timeStamp:时间戳,  target:触发事件的组件的属性值的集合{  id:事件源组件id,  tagName:当前组件的类型,  dataset:事件源组件上由data-开头的自定义属性组成的集合 },  currentTarget:当前组件的一些属性值集合,  detail:额外信息{x,y}触摸点的位置,  touches:手指列表,  changedTouches:移动了的手指信息 }