微信小程序 生命周期详解


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 相关文章推荐
有效的捕获JavaScript焦点的方法小结
Oct 08 Javascript
JS打开新窗口的2种方式
Apr 18 Javascript
JS幻灯片可循环播放可平滑旋转带滚动导航(自写)
Aug 05 Javascript
jquery 实现密码框的显示与隐藏示例代码
Sep 18 Javascript
微信小程序 教程之引用
Oct 18 Javascript
使用jquery给新生的th绑定hover事件的实例
Feb 10 Javascript
详解通过JSON数据使用VUE.JS
May 26 Javascript
Vue实现active点击切换方法
Mar 16 Javascript
详解如何在webpack中做预渲染降低首屏空白时间
Aug 22 Javascript
详解auto-vue-file:一个自动创建vue组件的包
Apr 26 Javascript
vue轻量级框架无法获取到vue对象解决方法
May 12 Javascript
通过实例解析javascript Date对象属性及方法
Nov 04 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
php采集速度探究总结(原创)
2008/04/18 PHP
PHP编程计算文件或数组中单词出现频率的方法
2017/05/22 PHP
用js实现的抽象CSS圆角效果!!
2007/05/03 Javascript
执行iframe中的javascript方法
2008/10/07 Javascript
JS 学习笔记 防止发生命名冲突
2009/07/30 Javascript
JS事件Event元素(兼容IE,Firefox,Chorme)
2012/11/01 Javascript
jquery中使用$(#form).submit()重写提交表单无效原因分析及解决
2013/03/25 Javascript
js获得地址栏?问号后参数的方法
2013/08/08 Javascript
自己用jQuery写了一个图片的马赛克消失效果
2014/05/04 Javascript
JavaScript将字符串转换成字符编码列表的方法
2015/03/19 Javascript
Javascript实现商品秒杀倒计时(时间与服务器时间同步)
2015/09/16 Javascript
一种新的javascript对象创建方式Object.create()
2015/12/28 Javascript
基于BootStrap Metronic开发框架经验小结【七】数据的导入、导出及附件的查看处理
2016/05/12 Javascript
微信小程序 教程之wxapp视图容器 swiper
2016/10/19 Javascript
js实现年月日表单三级联动
2020/04/17 Javascript
移动端web滚动分页的实现方法
2017/05/05 Javascript
通过命令行生成vue项目框架的方法
2017/07/12 Javascript
vue中component组件的props使用详解
2017/09/04 Javascript
vue与bootstrap实现简单用户信息添加删除功能
2019/02/15 Javascript
通过JS深度判断两个对象字段相同
2019/06/14 Javascript
Vue实现简易购物车页面
2020/12/30 Vue.js
js实现Element中input组件的部分功能并封装成组件(实例代码)
2021/03/02 Javascript
[41:52]2018DOTA2亚洲邀请赛3月29日 小组赛A组 TNC VS OpTic
2018/03/30 DOTA
[01:18]PWL开团时刻DAY10——一拳超人
2020/11/11 DOTA
python连接MySQL、MongoDB、Redis、memcache等数据库的方法
2013/11/15 Python
Python 实现递归法解决迷宫问题的示例代码
2020/01/12 Python
Python Scrapy多页数据爬取实现过程解析
2020/06/12 Python
Python+Kepler.gl实现时间轮播地图过程解析
2020/07/20 Python
Missguided美国官网:英国时尚品牌
2018/01/18 全球购物
美国轮胎网站:Priority Tire
2018/11/28 全球购物
GC是什么?为什么要有GC?
2013/12/08 面试题
学院党的群众路线教育实践活动整改方案
2014/10/04 职场文书
2015年护士工作总结范文
2015/03/31 职场文书
倡议书格式及范文
2015/04/29 职场文书
TV动画《政宗君的复仇》第二季制作决定PV公布
2022/04/02 日漫
我们认为中短波广播场强仪的最佳组合
2022/04/05 无线电