微信小程序 生命周期详解


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 相关文章推荐
[Web]防止用户复制页面内容和另存页面的方法
Feb 06 Javascript
eclipse如何忽略js文件报错(附图)
Oct 30 Javascript
TypeScript 中接口详解
Jun 19 Javascript
JavaScript通过代码调用Flash显示的方法
Feb 02 Javascript
使用AngularJS对表单提交内容进行验证的操作方法
Jul 12 Javascript
小程序图片长按识别功能的实现方法
Aug 30 Javascript
vue组件之间数据传递的方法实例分析
Feb 12 Javascript
vue2.0基于vue-cli+element-ui制作树形treeTable
Apr 30 Javascript
Node.js 路由的实现方法
Jun 05 Javascript
JS实现多选框的操作
Jun 24 Javascript
js实现3D粒子酷炫动态旋转特效
Sep 13 Javascript
(开源)微信小程序+mqtt,esp8266温湿度读取
Apr 02 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
一个程序下载的管理程序(一)
2006/10/09 PHP
用PHP+MySql编写聊天室
2006/10/09 PHP
php将数据库中的电话号码读取出来并生成图片
2008/08/31 PHP
解析PHP中empty is_null和isset的测试
2013/06/29 PHP
php生成图片验证码
2015/06/09 PHP
PHPMailer发送邮件
2016/12/28 PHP
浅谈Laravel模板实体转义带来的坑
2019/10/22 PHP
php判断数组是否为空的实例方法
2020/05/10 PHP
node.js中的path.normalize方法使用说明
2014/12/08 Javascript
浅谈js函数的多种定义方法与区别
2016/11/29 Javascript
JavaScript数据结构之二叉查找树的定义与表示方法
2017/04/12 Javascript
nodejs处理图片的中间件node-images详解
2017/05/08 NodeJs
详解VueJs前后端分离跨域问题
2017/05/24 Javascript
JS实现对json对象排序并删除id相同项功能示例
2018/04/18 Javascript
详解Vue CLI3 多页应用实践和源码设计
2018/08/30 Javascript
VuePress 快速踩坑小结
2019/02/14 Javascript
小程序实现图片预览裁剪插件
2019/11/22 Javascript
Vue export import 导入导出的多种方式与区别介绍
2020/02/12 Javascript
Python字符串拼接、截取及替换方法总结分析
2016/04/13 Python
详解Python中heapq模块的用法
2016/06/28 Python
python使用ddt过程中遇到的问题及解决方案【推荐】
2018/10/29 Python
详解Python使用Plotly绘图工具,绘制甘特图
2019/04/02 Python
python机器学习库scikit-learn:SVR的基本应用
2019/06/26 Python
详解如何用TensorFlow训练和识别/分类自定义图片
2019/08/05 Python
Python获取当前脚本文件夹(Script)的绝对路径方法代码
2019/08/27 Python
np.random.seed() 的使用详解
2020/01/14 Python
通过css3的filter滤镜改变png图片的颜色的示例代码
2020/05/06 HTML / CSS
阿联酋电子产品购物网站:Menakart
2017/09/15 全球购物
Supersmart英国:欧洲市场首批食品补充剂供应商之一
2018/05/05 全球购物
现代化办公人员工作的自我评价
2013/10/16 职场文书
学校教师读书活动总结
2014/07/08 职场文书
2014年档案管理工作总结
2014/11/17 职场文书
物业工程部岗位职责
2015/02/11 职场文书
高效笔记技巧分享:学会这些让你不再困扰
2019/09/04 职场文书
详细介绍Next.js脚手架完整搭建封装
2022/04/26 Javascript
CSS中calc(100%-100px)不加空格不生效
2023/05/07 HTML / CSS