小程序生命周期

小程序生命周期分为三类：

1. 应用生命周期（小程序启动，运行，销毁）
2. 页面生命周期（小程序中，页面的加载，渲染，销毁）
3. 组件生命周期（）

小程序的应用生命周期

需要在app.js中声明，如下：

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

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

页面生命周期函数

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('用户正在分享！');
    }
})

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

应用和页面生命周期关系，先执行应用生命周期，在执行页面生命周期，如：

页面从后台切入前台时，先执行应用onshow，再执行页面onshow

组建生命周期

1. created 组件实例创建完毕，有this，不能setData，在这个生命周期内，我们只可以获取一些基本的值以及数据上的做处理，跟页面渲染相关的内容不能在这个生命周期实现；
2. attached 组件完全初始化完毕，挂载，可以设置data，和vue的mounted比较像，这个阶段才是我们一般做初始化的阶段，并且在这个阶段data也被初始化为组件的值；
3. ready 视图层布局完成，组件挂载完毕后执行，就是组件被挂载到页面上，并且页面渲染完毕后触发；这个生命周期我们一般处理一些跟视图操作相关的内容；
4. move 组件从页面节点树移除，组件移动
5. detached 组件离开页面节点树，组件已经卸载
6. error 组件发生错误

小程序打开时生命周期