小程序生命周期

小程序的生命周期有三种：应用级生命周期，页面级生命周期以及组件生命周期。

应用级生命周期

小程序启动之后，页面被展示，此时小程序处于前台状态。
用户关闭小程序，小程序进入后台状态，并没有真正的被关闭。

而小程序的应用级生命周期指的就是App的生命周期。在App.js中定义了几个应用级的生命周期函数，链接如下：App参数，包括：

• onLaunch 初始化小程序时触发，并且只会触发一次
• onShow 初始化完成后从后台切换到前台显示
• onHide 从前台切换到后台被隐藏起来时触发
• onError 小程序发生脚本错误或者api调用错误时触发
• onPageNotFound 小程序需要打开的页面不存在的时候触发
• onUnhandledRejection 小程序有未处理的Promise拒绝触发
• onThemeChange 系统切换主题的时候触发

//app.js 文件

App({

	onLaunch:function(){ // 监听小程序的初始化
		console.log("onLaunch");
	}，

	onShow:function(){ // 监听小程序的显示
		console.log("onShow");
	}，

	onHide:function(){ // 监听小程序的隐藏
		console.log("onHide");
	}，

	onError:function(message){ // 错误小程序报错
		console.log("onError"+ message);
	}，
	globalData: {
	//在globalData中定义的数据，在其他页面可以使用
	//const app=getApp()
	//app.globalData.XXX来获取数据
	}

})

页面级生命周期

官方文档链接：Page

• onLoad 页面加载时触发，一个页面只会调用一次
• onShow 页面显示/切入前台时触发
• onHide 页面隐藏或者切入后台时触发
• onReady 页面初次渲染完成时触发，一个页面只会调用一次
• onUnload 页面卸载时触发，如wx.redirectTo或者wx.navigateBack到其他页面

页面的生命周期：
1.页面首次加载时触发onLoad事件
2.当页面展示的时候。会触发onShow事件
3.如果该页面是首次渲染完成，触发onReady事件
4.当该页面被切入后台时触发onHide事件，再次切回到前台时触发onShow
5.当页面被销毁时触发onUnload事件

组件生命周期

官方文档链接：组件生命周期

备注：写在lifetimes里的优先级最高，可以把写在其他地方的生命周期函数覆盖

Component({
  lifetimes: {
    attached: function() {
      // 在组件实例进入页面节点树时执行
    },
    detached: function() {
      // 在组件实例被从页面节点树移除时执行
    },
  },
  // 以下是旧式的定义方式，可以保持对 <2.2.3 版本基础库的兼容
  attached: function() {
    // 在组件实例进入页面节点树时执行
  },
  detached: function() {
    // 在组件实例被从页面节点树移除时执行
  },
  // ...
})

• created 在组件实例刚刚被创建时执行，此时不能使用setData更新属性的value
• attached 在组件实例进入页面节点树时执行，数据初始化可以使用setData进行数据赋值
• ready 在组件在视图层布局完成后执行
• moved 在组件实例被移动到节点树另一个位置时执行
• detached 在组件实例被从页面节点树移除时执行
• error 每当组件方法抛出错误时执行

组件所在页面的生命周期

还有一些特殊的生命周期，有事组件需要获知便于组件内部处理，在pageLifetimes中定义，该部分有四个生命周期函数：

注意：自定义tabBar的pageLifetime不会触发

Component({
  pageLifetimes: {
    show: function() {
      // 页面被展示
    },
    hide: function() {
      // 页面被隐藏
    },
    resize: function(size) {
      // 页面尺寸变化
    }
  }
})