生命周期
和vue react 一样,小程序也有自己的生命周期。
小程序生命周期比较复杂,分为三类:
应用级
在app.js中定义
-
onLaunch 应用初始化时执行
-
onShow 应用恢复前台时执行
-
onHide 应用到后台时执行
App({
onLaunch() {},
onShow() {},
onHide() {}
})
页面级
-
onLoad
-
onShow
-
onReady
-
onHide
-
onUnLoad
Page({
/*页面的初始数据*/
data: {},
/*生命周期函数--监听页面加载*/
onLoad: function (options) {},
/*生命周期函数--监听页面初次渲染完成*/
onReady: function () {},
/*生命周期函数--监听页面显示*/
onShow: function () {},
/*生命周期函数--监听页面隐藏*/
onHide: function () {},
/*生命周期函数--监听页面卸载*/
onUnload: function () {}
})
组件级
-
created 组件被创建
-
attached 进入到页面节点树
-
ready 视图布局渲染完成
-
moved 被移动到其他节点处
-
detached 被移除
组件的生命周期建议放在lifetimes中
Component({
lifetimes: {
attached() {},
detached() {}
}
})
在组件中可以获得到页面生命周期
Component({
pageLifetimes: {
// 没有on
show() {},
hide() {},
resize() {},
routeDone() {}
}
})