微信小程序的全局生命周期和页面生命周期

        生命周期是指一个程序或者软件从创建、到开始、暂停、唤起、停止、卸载的过程,由于微信小程序分为全局和页面两部分,所有从这两部分来讲解微信小程序的生命周期

1、全局生命周期

           全局生命周期指的是使用App() 函数注册一个小程序,接受一个object参数,其指定小程序的生命周期回调等。

App() 必须在 app.js 中调用,必须调用且只能调用一次。不然会出现无法预期的后果

(1)onLaunch(Object object):生命周期回调——监听小程序初始化,全局只触发一次;

         参数:与 wx.getLaunchOptionsSync 一致;

(2)onShow(Object object):生命周期回调——小程序启动,或从后台进入前台显示时触发;

         参数:与 wx.onAppShow 一致;

(3)onHide():小程序从前台进入后台时触发;

(4)onError(String error):生命周期回调——小程序发生脚本错误或 API 调用报错时触发;

        参数:与 wx.onError 一致

以下回调函数从高版本开始支持,低版本需做兼容处理,了解基本功能即可。

(5)onPageNotFound(Object object):小程序要打开的页面不存在时触发;

(6)onUnhandledRejection(Object object):小程序有未处理的 Promise 拒绝时触发;

(7)onThemeChange(Object object):系统切换主题时触发。

// app.js  App() 必须在 app.js 中调用,必须调用且只能调用一次。不然会出现无法预期的后果
App({
  onLaunch (options) {
    console.log(options);
  },
  onShow (options) {
    console.log(options);
  },
  onHide () {
    console.log();
  },
  onError (msg) {
    console.log(msg)
  },
})

2、页面生命周期

        使用Page(Object object)函数注册小程序中的一个页面。接受一个 Object 类型参数,其指定页面的初始数据、生命周期回调、事件处理函数等。

(1)onLoad(Object query):页面加载时触发。一个页面只会调用一次,可以在 onLoad 的参数中获取打开当前页面路径中的参数;

        参数:

名称类型说明
queryObject打开当前页面路径中的参数

(2)onShow():页面显示/切入前台时触发;

(3)onReady():页面初次渲染完成时触发。一个页面只会调用一次,代表页面已经准备妥当,可以和视图层进行交互;

(4)onHide():页面隐藏/切入后台时触发。 如底部 tab 切换到其他页面,小程序切入后台等;

(5)onUnload():页面卸载时触发。如wx.redirectTowx.navigateBack到其他页面时。

(6)onPullDownRefresh():监听用户下拉刷新事件。

(7)onReachBottom():监听用户上拉触底事件。

(8)onPageScroll(Object object):监听用户滑动页面事件。

(9)onAddToFavorites(Object object):监听用户点击右上角菜单“收藏”按钮的行为,并自定义收藏内容。

(10)onShareAppMessage(Object object):监听用户点击页面内转发按钮(button 组件 open-type="share")或右上角菜单“转发”按钮的行为,并自定义转发内容

(11)onShareTimeline():监听右上角菜单“分享到朋友圈”按钮的行为,并自定义分享内容。

在这里插入图片描述

 

// 页面生命周期
  onLoad(){
    console.log("onLoad-------生命周期回调—监听页面加载【请求页面初始化数据】");
  },
  onShow(){
    console.log("onShow-------生命周期回调—监听页面显示");
  },
  onReady(){
    console.log("onReady-------生命周期回调—监听页面初次渲染完成");
  },
  onHide(){
    console.log("onHide--------生命周期回调—监听页面隐藏");
  },
  onUnload(){
    console.log("onUnload-----------生命周期回调—监听页面卸载");
  },
  onPullDownRefresh(){
    console.log("onPullDownRefresh-----监听用户下拉动作");
  },
  onReachBottom(){
    console.log("onReachBottom-------页面上拉触底事件的处理函数");
  },
  onShareAppMessage(){
    console.log("onShareAppMessage---------用户点击右上角转发");
  },
  onShareTimeline(){
    console.log("onShareTimeline-----------用户点击右上角转发到朋友圈");
  },
  onAddToFavorites(){
    console.log("onAddToFavorites----------用户点击右上角收藏");
  },
  onPageScroll(){
    console.log("onPageScroll-----------页面滚动触发事件的处理函数");
  },
  onTabItemTap(){
    console.log("onTabItemTap-----------当前是 tab 页时,点击 tab 时触发");
  }

3、全局生命周期以及页面生命周期的触发顺序

在这里插入图片描述

1、首次进入小程序,全局生命周期加载

 

 2、页面生命周期加载

 

 

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

码农叮叮车

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值