微信小程序 生命周期详解


Posted in Javascript onOctober 12, 2016

微信小程序 生命周期

通俗的讲,生命周期就是指一个对象的生老病死。 从软件的角度来看,生命周期指程序从创建、到开始、暂停、唤起、停止、卸载的过程。

下面从一下三个方面介绍微信小程序的生命周期:

  1. 应用生命周期
  2. 页面生命周期
  3. 应用生命周期影响页面生命周期

》》》应用生命周期

微信小程序 生命周期详解

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

前台、后台定义: 当用户点击左上角关闭,或者按了设备 Home 键离开微信,小程序并没有直接销毁,而是进入了后台;当再次进入微信或再次打开小程序,又会从后台进入前台。

在整理本文资料的时候,有点不解,为什么不把小程序监听『销毁』方法开放给开发者,我猜测是因为IOS系统限制『按下Home键时,app从活动状态转入后台,会被挂起』;微信也不例外,只要运行一段时间或把微信客户端进程杀掉,就无法通知小程序应用被销毁。

》》》页面生命周期

微信小程序 生命周期详解

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

》》》应用生命周期影响页面生命周期

微信小程序 生命周期详解

  1. 小程序初始化完成后,页面首次加载触发onLoad,只会触发一次。
  2. 当小程序进入到后台,先执行页面onHide方法再执行应用onHide方法。
  3. 当小程序从后台进入到前台,先执行应用onShow方法再执行页面onShow方法。

下图是小程序从注册到页面加入,前后台切换流程。

微信小程序 生命周期详解

 感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
jQuery弹出层插件简化版代码下载
Oct 16 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(四)用地图块拼成大地图
Jan 23 Javascript
js Math 对象的方法
Sep 01 Javascript
toggle()隐藏问题的解决方法
Feb 17 Javascript
Node.js的Koa框架上手及MySQL操作指南
Jun 13 Javascript
AngularJs自定义服务之实现签名和加密
Aug 02 Javascript
JavaScript拖动层Div代码
Mar 01 Javascript
React Form组件的实现封装杂谈
May 07 Javascript
基于Vue自定义指令实现按钮级权限控制思路详解
May 23 Javascript
Vue.js组件通信之自定义事件详解
Oct 19 Javascript
基于JavaScript获取url参数2种方法
Apr 17 Javascript
vue动态加载SVG文件并修改节点数据的操作代码
Aug 17 Javascript
让html元素随浏览器的大小自适应垂直居中的实现方法
Oct 12 #Javascript
Angularjs手动解析表达式($parse)
Oct 12 #Javascript
js利用clipboardData实现截屏粘贴功能
Oct 12 #Javascript
利用jquery给指定的table动态添加一行、删除一行的方法
Oct 12 #Javascript
jQuery给指定的table动态添加删除行的操作方法
Oct 12 #Javascript
详解Javascript中的原型OOP
Oct 12 #Javascript
浅析BootStrap Treeview的简单使用
Oct 12 #Javascript
You might like
用ADODB来让PHP操作ACCESS数据库的方法
2006/12/31 PHP
php实现无限级分类
2014/12/24 PHP
JS预览图像将本地图片显示到浏览器上
2013/08/25 Javascript
jQuery调用RESTful WCF示例代码(GET方法/POST方法)
2014/01/26 Javascript
eclipse导入jquery包后报错的解决方法
2014/02/17 Javascript
AngularJs Javascript MVC 框架
2016/06/20 Javascript
JS针对浏览器窗口关闭事件的监听方法集锦
2016/06/24 Javascript
javascript中this关键字详解
2016/12/12 Javascript
jquery easyui DataGrid简单示例
2017/01/23 Javascript
JS实现中英文混合文字溢出友好截取功能
2018/08/06 Javascript
Node.js 使用axios读写influxDB的方法示例
2018/10/26 Javascript
微信小程序开发之左右分栏效果的实例代码
2019/05/20 Javascript
vue中使用WX-JSSDK的两种方法(推荐)
2020/01/18 Javascript
js实现单元格拖拽效果
2020/02/10 Javascript
微信小程序pinker组件使用实现自动相减日期
2020/05/07 Javascript
Vue项目打包部署到apache服务器的方法步骤
2021/02/01 Vue.js
[01:02:20]Mineski vs TNC 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
jupyter安装小结
2016/03/13 Python
python图片验证码生成代码
2016/07/02 Python
OpenCV实现人脸识别
2017/04/07 Python
Python 对输入的数字进行排序的方法
2018/06/23 Python
基于Python对数据shape的常见操作详解
2018/12/25 Python
Django CBV类的用法详解
2019/07/26 Python
pycharm如何设置官方中文(如何汉化)
2020/12/29 Python
websocket+sockjs+stompjs详解及实例代码
2018/11/30 HTML / CSS
购买大码女装:Lane Bryant
2016/09/07 全球购物
教学评估实施方案
2014/03/16 职场文书
银行职员自我鉴定
2014/04/20 职场文书
2014年客房服务员工作总结
2014/11/18 职场文书
稽核岗位职责
2015/02/10 职场文书
史上最牛的辞职信
2015/02/28 职场文书
办公室行政主管岗位职责
2015/04/09 职场文书
毕业论文答辩开场白和结束语
2015/05/27 职场文书
教师读书笔记
2015/06/29 职场文书
小学班主任培训心得体会
2016/01/07 职场文书
IDEA 2022 Translation 未知错误 翻译文档失败
2022/04/24 Java/Android