微信小程序生命周期钩子函数

小程序生命周期

1.应用生命周期
   入口文件  首先调用APP方法

2.页面生命周期
页面js 首先调用Page方法

3.组件生命周期
组件js 首先调用Comonent方法

4.App()函数用来注册一个小程序。接受一个 Object参数，其指定小程序的生命周期回调等。
App() 必须在 app.js 中调用，必须调用且只能调用一次。

小程序应用生命周期

属性 类型 默认值 必填 说明 最低版本
1.onLaunch function 否 生命周期回调——监听小程序初始化
2.onShow function 否 生命周期回调——监听小程序启动或切前台
3.onHide function 否 生命周期回调——监听小程序切后台
4.onError function 否 错误监听函数
5.onPageNotFound function 否 页面不存在监听函数 1.9.90
6.onUnhandledRejection function 否 未处理的Promise拒绝事件监听函数。 2.10.0
7.onThemeChange function 否 监听系统主题变化 2.11.0

当应用第一次启动就会触发的事件

onLaunch(){
//应用生命周期 一般情况下，在这个地方获取用户个人微信信息
console.log('onLaunch)
}

应用被用户看到

onShow(){
//页面重置
//小游戏中 倒计时--》59s 重置
}

当小程序被隐满的时候

onHide(){
//暂停或者清楚定时器
console.log("on Hide")
}

当应用代码发生错误的时候，获取错误信息，传递给后端服务器

onError(err){
//当应用发生错误的时候，获取错误信息，传递给后端服务器
console.log(''onError",err)
}

当页面找不到的时候就会触发

当应用第一次启动的时候，如果找不到第一个页面 就会被触发

onPageNotFound(){
//如果页面不存在了 ，通过js方式来重新跳转页面 或者重新导航第二个首页
console.log("onPageNotFound")
wx.navigtaionTo({
  url:''pages/whd1/whd1"
})
}

未处理的 promise拒绝事件监听函数

onUnhandledRejection(){
//(new Promise()).then(res=>{})
}

监听系统主题变化

onThemeChange(){
//系统主题 当微信切换主题模式的时候 小程序也跟着切换主题
//微信是支持 sass的声明变量的 globalColor=#ff0000
}

小程序页面生命周期

属性 类型 默认值 必填 说明
1.onLoad function 生命周期回调——监听页面加载
2.onShow function 生命周期回调——监听页面显示
3.onReady function 生命周期回调——监听页面初次渲染完成
4.onHide function 生命周期回调——监听页面隐藏
5.onUnload function 生命周期回调——监听页面加载
6.onPulllDownRefresh function 监听用户下拉动作
7.onReachBottom function 页面上拉触发事件的处理函数
8.onShareAppMessage function 用户点击右上角转发
9.onShareTimeline function 用户点击右上角收藏
10.onPageScroll function 页面滚动触发事件的处理函数
11.onResize function 页面尺寸改变时触发，详见响应 显示区域变化
12.onTabItemTap function 当前是tab页时，点击tab触发

生命周期函数–监听页面加载

onLoad:function(){
//页面加载时触发，一个页面只会调用一次，可以在onLoad的参数中获取打开当前页面路径中的参数 相当于vue的创建后
}

生命周期函数__ 监听页面显示

onshow:function(){
console.log("面的生命周期onShow")
}

生命周期函数__监听页面初次渲染完成

onReady:function(){
//页面初次渲染完成时触发，一个页面只会调用一次，代表页面已经准备妥当，可以和视图层进行交互。相当于vue的挂载后
console.log("页面的生命周期onReady")
}

生命周期函数__监听页面卸载

onUnload:function(){
//页面卸载时触发，如wx.redirectTo或wx.navigateBack到其他页面时
console.log("页面的生命周期onUnload")
}

页面相关事件处理函数__监听用户下拉动作（下拉刷新）

onPullDownRefresh:function(){
//应用场景 当页面需要下拉刷新请求数据的时候，在此发起异步请求操作
console.log("onPullDownRefresh")
}

页面上拉触发事件的处理函数（上拉加载更多）

onReachBottom:function(){
//只有当前页面拥有滚动条的时候才可以触发此事件 同时 可以在这个事件中 做一些异步请求操作（加载更多/分页）
console.log("onReachBottom__页面上拉触发事件的处理函数“）
}

监听用户滑动页面事件

onPageScroll(){
//模块懒家载经常会用到此功能 但是一般不推荐这么做 会非常非常消耗小程序性能
//注意：请只在需要的时候才在page中定义此方法，不要定义空方法。以减少不必要的事件派发对渲染层-逻辑层通信的影响。注意：请避免在onPageScroll中过于频繁的执行 setData等引起逻辑层_渲染层通信的操作。尤其是每次传输大量数据，会影响通信耗时。
console.log("监听用户滑动页面事件。”）
}

用户点击右上角分享

onShareAppMessage:function(){
//一般情况下 会在此进行本地用户数据的携带
console.log（“onShareAppMessage用户点击右上角分享”）
}

用户点击右上角分享到朋友圈

监听右上角菜单“分享到朋友圈”按钮的行为，并自定义分享内容。注意：只有定义了此事件处理函数，右上角菜单才会显示“分享到朋友圈”按钮

onShareTimeline(){
}

监听用户点击右上角菜单“收藏”按钮的行为，并定义收藏内容。

onAddToFavorites:function(){
}

当窗口大小发生改变的时候触发

onResize:function(){
console.log("当窗口大小发生改变的时候触发“）
}

当用户在tabBar中点击当前item的时候触发

onTabItemTap(){}