生命周期

什么是生命周期

​ 生命周期是指一个小程序从创建到销毁的一个过程。小程序的生命周期有两种；分别是应用生命周期，页面的生命周期。有时会把应用的生命周期和页面的生命周期混淆为一起，这两个其实应该是不同却又相互关联的生命周期

小程序启动流程

应用的生命周期函数

​ 首先小程序的生命周期函数是在app.js里面调用的，APP(Object)函数用来注册一个小程序。接受一个Object参数，指定其小程序的生命周期回调；在注册实例时，通常可以做以下事情：

​ 1.判断小程序的进入场景

​ 2.监听生命周期函数，在生命周期中执行对应的业务逻辑，比如在某个生命周期函数中获取微信用户的信息。

​ 3.因为App()实例只有一个，并且时全局共享的(单例对象)。所以可以将一些共享数据放在其中的globalData节点中

更多应用生命周期函数

App({
    // 应用第一次启动就会触发事件
    onLaunch:function(options){
        // 在应用第一次启动的时候 获取个人信息
        console.log("onLaunch")
        console.log(options)
    },
    // 应用被用户看到
    onShow:function(){
        // 小程序启动，或从后台进入前台显示时触发
        console.log("onShow")
    }，
    // 应用被隐藏
    onHide:function(){
        // 小程序被切换到后台（包括微信自身被切换到后台或者小程序暂时被切换到后台）
        console.log("onHide")
      },
    // 应用的代码发生了错误的时候就会触发
    onError:function(msg){
        // 在应用发生代码报错的时候,收集用户的错误信息,通过异步请求将错误的信息发送到后台
        console.log(msg)
    },
    // 页面找不到就会触发 应用第一次启动的时候,如果找不到第一个入口页面,才会触发。如果在小程序里面使用wx.navigateTo等路由Api进行页面跳转，如果页面不存在只会报错，并不会触发onPageNotFound
    onPageNotFound:function(res){
        wx.redirectTo({
              url: 'pages/...',
        })  // 如果是 tabbar 页面，请使用 wx.switchTab
        console.log("onPageNotFound")
        console.log(res)
    },
})

页面的生命周期函数

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

更多页面的生命周期的函数

Page({
    /**
    * 生命周期函数--监听页面加载
    */
   onLoad: function (options) {
        // 发送异步请求 初始化页面数据
          console.log(options);
          console.log(111)
   },
    /**
    * 生命周期函数--监听页面显示
    */
   onShow: function () {
     console.log("onShow");
   },
    /**
    * 生命周期函数--监听页面初次渲染完成
    */
   onReady: function () {
     console.log("onReady");
   },
    /**
    * 生命周期函数--监听页面隐藏
    */
   onHide: function () {
     console.log("onHide");
   },
    /**
    * 生命周期函数--监听页面卸载
    * 页面被关闭的时候，与上一个同理，如果是页面跳转，并且被关闭就算作卸载，会被触发
    */
   onUnload: function () {
     console.log("onUnload");
   },
    /**
    * 页面相关事件处理函数--监听用户下拉动作
    * 需要开启页面下拉功能  "enablePullDownRefresh": true
    */
   onPullDownRefresh: function () {
     console.log("onPullDownRefresh");
   },
    /**
    * 页面上拉触底事件的处理函数
    * 页面高度不够就不存在这个问题
    * 可用于上拉加载下一页数据
    */
   onReachBottom: function () {
     console.log("onReachBottom");
   },
    /**
    * 用户点击右上角转发
    */
   onShareAppMessage: function () {
     console.log("onShareAppMessage");
   },
    /**
    * 用户点击右上角转发到朋友圈
    */
   onShareTimeline: function(){
     console.log("onShareTimeline")
   }
    /**
    * 用户点击右上角收藏
    */
   onAddToFavorites:function(){
     console.log("onAddToFavorites")
   }
    /**
    * 页面滚动时触发
    */
   onPageScroll: function () {
     console.log("onPageScroll");
   },
    /**
    * 页面尺寸发生改变时触发
    * 手机页面一般不会改变，大部分情况是手机发生了横屏竖屏切换时触发
    * 横屏切换需要添加"pageOrientation":"auto"配置
    */
   onResize: function () {
     console.log("onResize");
   },
    /**
   * 当前是 tab ⻚时，点击 tab 时触发
   * 只存在于tabbar页面上 即当前页面必须是tabbar页面，同时点击自己的tabitem才会触发
   */
   onTabItemTap: function () {
     console.log("onTabItemTap");
   }
})