事件
事件分为冒泡事件和非冒泡事件
冒泡事件
- 当一个组件上的事件被触发后，『事件会向父节点传递』
- WXML的冒泡事件列表：即在触摸/动画开始结束等动作时发生的事件
非冒泡事件
- 当一个组件上的事件被触发后，事件不会向父节点传递』
- 除冒泡事件列表，且无特殊生命的都是非冒泡事件
绑定事件
- bind：普通事件绑定
- catch: 会阻止事件向上冒泡
- mut-bind：互斥事件绑定
- 触发后，只会有其中一个绑定函数被触发。且不影响bind和catch的绑定效果
事件的捕获阶段
- 触摸类事件支持捕获阶段。
- 捕获位于冒泡之前，且在捕获阶段中，事件到达节点的顺序与冒泡阶段恰好相反
- 捕获阶段监听事件：
- capture-bind
- capture-catch：中断捕获阶段和取消冒泡阶段
事件对象
基础事件对象属性列表
| 属性 | 说明 | |
|---|---|---|
| type | 事件类型 | |
| timeStamp | 事件生成时的时间戳 | |
| target | 触发事件的源组件 | |
| target | 触发事件的源组件 | |
| id | 事件源组件的 | |
| dataset | 事件源组件上由data-开头的自定义属性组成的集合 | |
| currentTarget | 当前组件的一些属性值集合 | |
| mark | 事件标记数据 |
自定义事件对象属性列表
- detail Object 额外的信息
触摸事件对象属性列表
| 属性 | 类型 | 说明 |
|---|---|---|
| touches | Array | 触摸事件，当前停留在屏幕中的触摸点信息的数组 |
| changedTouches | Array | 触摸事件，当前变化的触摸点信息的数组 |
特殊事件
- canvas 中的触摸事件不可冒泡，所以没有 currentTarget。
dataset:
- 在 WXML 中，这些自定义数据以 data- 开头，多个单词由连字符 - 连接。
- data-element-type，最终会呈现为 event.currentTarget.dataset.elementType (转驼峰)
- data-elementType，最终会呈现为 event.currentTarget.dataset.elementtype （大写转小写）
mark:
- mark 会包含从触发事件的节点到根节点上所有的 mark: 属性值
- Touch 对象
| 属性 | 类型 | 说明 |
|---|---|---|
| identifier | Number | 触摸点的标识符 |
| pageX,pageY | Number | 距离文档左上角的距离，文档的左上角为原点 |
| clientX,clientY | Number | 距离页面可显示区域(除去导航条)左上角距离 |
- CanvasTouch 对象
| 属性 | 类型 | 说明 |
|---|---|---|
| identifier | Number | 触摸点的标识符 |
| x,y | Number | 距离 Canvas 左上角的距离，Canvas 的左上角为原点 |
生命周期
App 生命周期
- 在App({})函数中定义
- onLaunch：小程序初始化时触发，『全局只触发一次』。通常用于初始化操作。
- onShow：小程序启动或从后台进入前台显示时触发。通常用于获取用户信息、判断是否登录。
- onHide：小程序从前台进入后台隐藏时触发。通常用于保存用户数据、暂停音乐播放。
- onError：小程序发生脚本错误或API调用失败时触发。通常用于对错误进行处理，如记录错误日志等操作。
- 注意
- 『异步操作』：生命周期函数可能包含异步操作，如网络请求、定时器.在这种情况上下，需要使用回调函数或Promise对象等方式来保证异步操作的正确执行。
- 『页面传参』：在小程序中跳转到其他页面时，可以通过 URL 参数传递数据。开发者需要在 onLoad 函数中获取参数并进行处理。
- 『数据缓存』：在小程序中，可以使用 wx.setStorage 和 wx.getStorage 等 API 将数据保存到本地缓存中。这些数据可以在小程序的不同页面中共享和访问，可以用于存储用户信息、配置项等数据。
页面生命周期
- 在Page({})函数中定义
- onLoad：页面『加载时』触发。通常用于获取页面参数、初始化数据等操作。
- onShow：页面『显示时』触发。通常用于刷新页面数据、重新加载组件等操作。
- onReady：页面『初次渲染完成时』触发。通常用于获取 DOM 节点、创建动画等操作。
- onHide：页面『隐藏时』触发。可以保存页面数据等操作。
- onUnload：页面『卸载时』触发，如 wx.redirectTo 或 wx.navigateBack 到其他页面时。通常用于保存页面数据、取消订阅事件等操作。
组件生命周期
- 在Component({})函数中的lifetimes对象中定义
- created：组件实例被创建时触发，此时this.data是Component构造器中的data，『不能调用setData』。
- attached：初始化完毕后，组件被加入到父组件中时触发，此时this.data为组件当前值。
- ready：组件在视图层布局完成后触发。
- moved：组件被移动到另一个节点时触发。
- detached：组件实例被从页面节点树中移除时触发。
- error：每当组件方法抛出错误时执行，参数Object Error
组件所在页面生命周期
- 在组件的pageLifetimes对象中定义
- show：组件所在的页面『被展示时』执行
- hide：组件所在的页面『被隐藏时』执行
- resize：组件所在的页面『尺寸变化』时执行，参数Object Size
- routeDone：组件所在页面『路由动画完成时』执行
- 注：自定义的tabBar的pageLifetime不会触发
