【微信小程序】小程序应用和页面生命周期_小程序页面的生命周期(2)

本文链接：https://blog.youkuaiyun.com/2401_84978578/article/details/138928499

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

App({
  /\*\*
 \* 当小程序初始化完成时，会触发 onLaunch（全局只触发一次）
 \*/
  onLaunch: function () {
      console.log("小程序启动！");
  },
  /\*\*
 \* 当小程序启动，或从后台进入前台显示，会触发 onShow
 \*/
  onShow: function (options) {
      console.log('小程序正在前台运行！');
  },
  /\*\*
 \* 当小程序从前台进入后台，会触发 onHide
 \*/
  onHide: function () { 
      console.log("小程序进入后台运行！");
  },
  /\*\*
 \* 当小程序发生脚本错误，或者 api 调用失败时，会触发 onError 并带上错误信息
 \*/
  onError: function (msg) {
    
  }
})

用户首次打开小程序，触发 onLaunch（全局只触发一次）。
小程序初始化完成后，触发onShow方法，监听小程序显示。
小程序从前台进入后台，触发 onHide方法。
小程序从后台进入前台显示，触发 onShow方法。
小程序后台运行一定时间，或系统资源占用过高，会被销毁。

属性	类型	描述	触发时机
onLaunch	Function	监听小程序初始化	当小程序初始化完成时，会触发 onLaunch（全局只触发一次）。
onShow	Function	监听小程序显示	当小程序启动，或从后台进入前台显示，会触发 onShow
onHide	Function	监听小程序隐藏	当小程序从前台进入后台，会触发 onHide
onError	Function	错误监听函数	当小程序发生脚本错误，或者 api 调用失败时，会触发 onError 并带上错误信息
其他	Any		开发者可以添加任意的函数或数据到 Object 参数中，用 this 可以访问，上面的getPics就是函数， globalName是数据，这里面的函数和数据都是全局的。调用方式：在Pager中通过getApp()方法得到App对象并获得全局的数据和调用全局的函数

前台、后台定义：当用户点击左上角关闭，或者按了设备 Home 键离开微信小程序并没有直接销毁，而是进入了后台；当再次进入微信或再次打开小程序，又会从后台进入前台。

小程序的页面生命周期函数

小程序的页面生命周期函数需要在页面.js 中进行声明。如：

Page({
    /\*\*
 \* 页面的初始数据
 \*/
    data: {
    },

    /\*\*
 \* 生命周期函数--监听页面加载
 \*/
    onLoad(options) {
        console.log('本地生活页面加载完毕');
    },
    /\*\*
 \* 生命周期函数--监听页面初次渲染完成
 \*/
    onReady() {
        console.log("初次渲染完毕！");
    },
    /\*\*
 \* 生命周期函数--监听页面显示
 \*/
    onShow() {
        console.log("页面显示完成");
    },
    /\*\*
 \* 生命周期函数--监听页面隐藏
 \*/
    onHide() {
        console.log("页面已被隐藏！");
    },
    /\*\*
 \* 生命周期函数--监听页面卸载
 \*/
    onUnload() {
        console.log("GG");
    },

    /\*\*
 \* 页面相关事件处理函数--监听用户下拉动作
 \*/
    onPullDownRefresh() {
        console.log('正在刷新！');
    },

    /\*\*
 \* 页面上拉触底事件的处理函数
 \*/
    onReachBottom() {
        console.log('正在加载更多！');
    },

    /\*\*
 \* 用户点击右上角分享
 \*/
    onShareAppMessage() {
        console.log('用户正在分享！');
    }
})

小程序注册完成后，加载页面，触发onLoad方法。
页面载入后触发onShow方法，显示页面。
首次显示页面，会触发onReady方法，渲染页面元素和样式，一个页面只会调用一次。
当小程序后台运行或跳转到其他页面时，触发onHide方法。
当小程序有后台进入到前台运行或重新进入页面时，触发onShow方法。
当使用重定向方法wx.redirectTo(OBJECT)或关闭当前页返回上一页wx.navigateBack()，触发onUnload。

函数	说明	作用
onLoad	生命周期回调—监听页面加载	发送请求获取数据
onShow	生命周期回调—监听页面显示	请求数据
onReady	生命周期回调—监听页面初次渲染完成	获取页面元素(少用)
onHide	生命周期回调—监听页面隐藏	终止任务，如定时器或者播放音乐
onUnload	生命周期回调—监听页面卸载	终止任务

应用生命周期与页面生命周期之间的交互

在这里插入图片描述

小程序初始化完成后，页面首次加载触发onLoad，只会触发一次。
当小程序进入到后台，先执行页面onHide方法再执行应用onHide方法。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上C C++开发知识点，真正体系化！

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频，并且后续会持续更新

如果你需要这些资料，可以戳这里获取

阶课程，涵盖了95%以上C C++开发知识点，真正体系化！**

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频，并且后续会持续更新

如果你需要这些资料，可以戳这里获取