生命周期的概念简述:
生命周期,生命周期通俗以人来说就是一个对象的生老病死,从软件的角度来说,小程序生命周期分为创建、到开始、暂停、唤起、停止、卸载的过程。
小程序中的生命周期有以下三种:
1.应用级生命周期
应用级生命周期 ,就是指整个微信小程序实例应用的生命周期,App用来 注册小程序。
接受一个 Object 参数,其指定小程序的生命周期回调钩子函数等,App() 必须在 app.js
中调用,必须调用且只能调用一次。不然会出现无法预期的后果。
App.js 中代码示例:
App({
//当小程序初始化完成时,会触发 onLaunch(全局只触发一次)
onLaunch() {
console.log("当小程序初始化完成时");
},
//当小程序启动,或从后台进入前台显示,会触发 onShow
onShow(options) {
console.log("当小程序启动,或从后台进入前台显示");
},
//当小程序从前台进入后台,会触发 onHide
onHide() {
console.log("当小程序从前台进入后台");
},
//当小程序发生脚本错误,或者 api 调用失败时,会触发 onError 并带上错误信息
onError(msg) {
console.log("当小程序发生脚本错误,或者 api 调用失败时,");
},
onPageNotFound(){
console.log("小程序要打开的页面不存在时触发");
},
onUnhandledRejection(){
console.log("小程序有未处理的 Promise 拒绝时触发");
},
onThemeChange(){
console.log("切换系统主题时候触发");
},
})
2.页面级(Page)生命周期:
页面生命周期函数就是每进入到一个新的页面的时候,就会调用的生命周期函数,通过App(Object)函数用来注册一个小页面
Page 中代码示例:
Page({
onLoad(options) {
//页面加载时触发。一个页面只会调用一次
},
onShow() {
//页面显示/切入前台时触发
},
onReady() {
//页面初次渲染完成时触发。一个页面只会调用一次,代表页面已经准备妥当,可以和视图层进行交互
},
onHide() {
//页面隐藏/切入后台时触发
},
onUnload() {
//页面卸载时触发
},
onRouteDone() {
//路由动画完成时触发
},
})
3.组件生命周期:
组件的生命周期是指组件自身的一些函数,当满足某些条件时就会被触发,通过Components(Object)来注册组件。这些函数在特殊的时间点或遇到一些特殊的框架事件时被自动触发。
其中,最重要的生命周期是 created
attached
detached
created:监听页面加载
attached:监听页面显示(这个生命周期用的多,绝大多数初始化工作可以在这里进行)
ready:监听页面初次渲染完成
moved:监听页面隐藏
detached:监听页面卸载
error:每当组件方法抛出错误时间
补充哈~:
还有一些特殊的生命周期,虽然和组件的关联不是很大,但有时候组件需要用到,以便组件内部处理,这样的生命周期称为“组件所在页面的生命周期” (pageLifetimes)
Component({
lifetimes: {
attached: function() {
// 在组件实例进入页面节点树时执行
},
detached: function() {
// 在组件实例被从页面节点树移除时执行
},
},
// 以下是旧式的定义方式,可以保持对 <2.2.3 版本基础库的兼容
attached: function() {
// 在组件实例进入页面节点树时执行
},
detached: function() {
// 在组件实例被从页面节点树移除时执行
},
// ...
})
最近在写小程序相关的项目,所以会多写一些关于小程序相关的知识点~