浅谈微信小程序生命周期
一直想着说,写些什么东西来记录下自己的成长史,终于要开始实践了
第一次写博客,望各位大牛指点一二
前言
(1)为什么是微信小程序
今年刚毕业,加上实习的日子,在公司近一年的时间了,期间一直在写小程序的相关功能,对小程序的一些基础功能较为熟悉.
(2)技术 原生js + redux + 微信小程序官方API
今天主要是讲述一下自己对于微信小程序生命周期的了解,虽然已经能在各个平台查询到相关文档,但觉得写出来,能整理下思绪,也望可以得到大牛们的指教.
解析
小程序主要分为两个生命周期:全局的生命周期 + 页面的生命周期
小程序App生命周期
App生命周期主要在app.js中调用,主要是:
- onLaunch -- 小程序初始化完成,全局只触发一次
- onShow -- 小程序启动时,或者从后台进入前台
- onHide -- 小程序从前台进入后台时执行
- onError -- 小程序运行脚本出错或者api调用失败时执行,会带上错误信息
- onPageNotFound -- 小程序页面不存在时执行
执行顺序: onLaunch–> onShow --> onHide
小程序Pages生命周期
Pages生命周期主要是指各个文件对应的js中的生命周期,主要是:
- onLoad -- 页面加载时执行,只执行一次
- onReady -- 页面初次渲染时执行,只执行一次
- onShow -- 页面展示时执行,执行多次
- onHide -- 页面从前台进入后台时执行
- onUnload -- 页面卸载时执行
注意点:当切换页面需要多次渲染数据改变状态,建议在onShow中使用,当只需初始化一次的时候,可在onLoad或者onReady中使用。当需要清除定时器时,可在onUnload中使用
执行顺序:onLoad --> onShow --> onReady --> onHide
切换页面时触发的生命周期:
当首次加载A页面,A触发的生命周期为:onLoad --> onShow --> onReady,从A页面切换到B页面时,A页面触发onHide,B页面触发的生命周期顺序与上面一致,当B页面返回到A页面时,触发onUnload,当不清缓存,再次进入A页面时,只触发onShow.
Pages实例化生命周期
小程序官方文档中有一张图表明了实例化的过程,我就直接拿过来了,可自行查看
https://developers.weixin.qq.com/miniprogram/dev/framework/app-service/page-life-cycle.html解释:如下图
运行机制
概念:
热启动:指的是小程序启动成功后,你点了左上角的x或者按了home键离开小程序,小程序并没有直接被销毁,而是进入了后台运行机制中,当你在一定时间内再次打开该小程序时,小程序这时候从后台又重新进入前台,重新渲染页面,这个过程就是热启动
冷启动:指的是小程序初次加载(从未打开),或者当你卸载小程序,或者被微信自动销毁的时候,当你再次进入重新加载小程序时,这个过程就是冷启动
注意点:小程序只有在冷启动的时候,才会触发onLaunch生命周期
总结
小程序的一辈子:
- 打开小程序:(App)onLaunch --> (App)onShow --> (Pages)onLoad --> (Pages)onShow --> (pages)onReady
- 进入下一个页面:(Pages)onHide --> (Next)onLoad --> (Next)onShow --> (Next)onReady
- 返回上一个页面:(curr)onUnload --> (pre)onShow
- 离开小程序:(App)onHide
- 再次进入:小程序未销毁 --> (App)onShow(执行上面的顺序),小程序被销毁,(App)onLaunch重新开始执行.