小程序的生命周期
代码语言：javascript复制App({
/**
* 当小程序初始化完成时，会触发 onLaunch（全局只触发一次）
*/
onLaunch: function () {
},
/**
* 当小程序启动，或从后台进入前台显示，会触发 onShow （应用进入前台）
*/
onShow: function (options) {
},
/**
* 当小程序从前台进入后台，会触发 onHide （应用进入后台）
*/
onHide: function () {
},
/**
* 当小程序发生脚本错误，或者 api 调用失败时，会触发 onError 并带上错误信息
*/
onError: function (msg) {
}
})
重要概念：
- 后台：当用户点击左上角关闭（或者右上角退出），或者按了home键离开微信，小程序并没有直接销毁，而是进入了后台。
- 前台：当再次进入微信或者再次打开小程序，又会从后台进入前台。
onShow(){
console.log("onShow");
},
onHide(){
//定时器场景
console.log("onHide");}
小程序单个页面的生命周期
代码语言：javascript复制/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示(页面打开的时候触发)
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏（页面隐藏的时候触发）(打开其他页面时当前页面就认为被隐藏)
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载（打开A页面进入B页面，当返回A页面的时候就是B页面的卸载）
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
请谈谈小程序的生命周期函数？
属性 | 类型 | 默认值 | 必填 | 说明 | 最低版本 |
|---|---|---|---|---|---|
?onLaunch | function | 否 | 生命周期回调——监听小程序初始化。 | ||
?onShow | function | 否 | 生命周期回调——监听小程序启动或切前台。 | ||
?onHide | function | 否 | 生命周期回调——监听小程序切后台。 | ||
?onError | function | 否 | 错误监听函数。 | ||
?onPageNotFound | function | 否 | 页面不存在监听函数。 | ?1.9.90 | |
?onUnhandledRejection | function | 否 | 未处理的 Promise 拒绝事件监听函数。 | ?2.10.0 | |
?onThemeChange | function | 否 | 监听系统主题变化 | ?2.11.0 | |
其他 | any | 否 | 开发者可以添加任意的函数或数据变量到 Object 参数中，用 this 可以访问 |
页面：
- onLoad() 页面加载时触发，只会调用一次，可获取当前页面路径中的参数。
- onShow() 页面显示/切入前台时触发，一般用来发送数据请求；
- onReady() 页面初次渲染完成时触发, 只会调用一次，代表页面已可和视图层进行交互。
- onHide() 页面隐藏/切入后台时触发, 如底部 tab 切换到其他页面或小程序切入后台等。
- onUnload() 页面卸载时触发，如redirectTo或navigateBack到其他页面时。
属性 | 说明 |
|---|---|
?onLoad | 生命周期回调—监听页面加载 |
?onShow | 生命周期回调—监听页面显示 |
?onReady | 生命周期回调—监听页面初次渲染完成 |
?onHide | 生命周期回调—监听页面隐藏 |
?onUnload | 生命周期回调—监听页面卸载 |
component:
定义段 | 描述 | 最低版本 |
|---|---|---|
created | 组件生命周期函数-在组件实例刚刚被创建时执行，注意此时不能调用 setData ) | |
attached | 组件生命周期函数-在组件实例进入页面节点树时执行) | |
ready | 组件生命周期函数-在组件布局完成后执行) | |
moved | 组件生命周期函数-在组件实例被移动到节点树另一个位置时执行) | |
detached | 组件生命周期函数-在组件实例被从页面节点树移除时执行) | |
lifetimes | 组件生命周期声明对象，参见 ?组件生命周期 | ?2.2.3 |
pageLifetimes | 组件所在页面的生命周期声明对象，参见 ?组件生命周期 | ?2.2.3 |
小程序页面生命周期
data
data 是页面第一次渲染使用的初始数据。
页面加载时，data 将会以JSON字符串的形式由逻辑层传至渲染层，因此data中的数据必须是可以转成JSON的类型：字符串，数字，布尔值，对象，数组。
渲染层可以通过 ?WXML 对数据进行绑定。
小程序应用生命周期
页面事件处理函数
onPullDownRefresh()
监听用户下拉刷新事件。
- 需要在
app.json的?window选项中或?页面配置中开启enablePullDownRefresh。 - 可以通过?wx.startPullDownRefresh触发下拉刷新，调用后触发下拉刷新动画，效果与用户手动下拉刷新一致。
- 当处理完数据刷新后，?wx.stopPullDownRefresh可以停止当前页面的下拉刷新。
onReachBottom()
监听用户上拉触底事件。
- 可以在
app.json的?window选项中或?页面配置中设置触发距离onReachBottomDistance。 - 在触发距离内滑动期间，本事件只会被触发一次。
onPageScroll(Object object)
监听用户滑动页面事件。
参数 Object object:
属性 | 类型 | 说明 |
|---|---|---|
scrollTop | Number | 页面在垂直方向已滚动的距离（单位px） |
注意：请只在需要的时候才在 page 中定义此方法，不要定义空方法。以减少不必要的事件派发对渲染层-逻辑层通信的影响。 注意：请避免在 onPageScroll 中过于频繁的执行 setData 等引起?逻辑层-渲染层通信的操作。尤其是每次传输大量数据，会影响通信耗时。
今天的文章就分享到这儿，如果大家喜欢的话，欢迎点赞，将会在接下来的一段时间里，持续分享更多优质内容。
