微信小程序页面生命周期详解


Posted in Javascript onJanuary 31, 2018

微信小程序页面生命周期介绍,具体如下

页面生命周期函数

onLoad—-监听页面加载
onReady—-监听页面初次渲染完成
onShow—-监听页面显示
onHide—-监听页面隐藏
onUnload—-监听页面卸载

Page({

 /**
  * 页面的初始数据
  */
 data: {
  banner_url:data.bannerList(),
  open:false
 },

 /**
  * 生命周期函数--监听页面加载
  */
 onLoad: function (options) {
  console.log("==onLoad==");
 },

 /**
  * 生命周期函数--监听页面初次渲染完成
  */
 onReady: function () {
  console.log("==onReady==");
 },

 /**
  * 生命周期函数--监听页面显示
  */
 onShow: function () {
  console.log("==onShow==");
 },

 /**
  * 生命周期函数--监听页面隐藏
  */
 onHide: function () {
  console.log("==onHide==");
 },

 /**
  * 生命周期函数--监听页面卸载
  */
 onUnload: function () {
  console.log("==onUnload==");
 }
})

进入首页触发的函数

微信小程序页面生命周期详解 

进入和离开blog页面的触发函数

微信小程序页面生命周期详解 

总结:

1. 在离开首页进入详情页面的时候采用的是onHide函数—-只是将页面隐藏,当我们回到首页的时候直接用onShow显示就好;
2. 在离开详情页面的时候采用的是onUnload函数—-此处是将页面卸载,所以下次进入详情页面的时候,我们需要将页面再次(加载—-显示—-渲染)
3. 以上情况是在不设置open-type的情况,如果open-type=”redirect”,那么在离开首页的时候就会触发onUnload,从而不能再返回首页。

详情参考:微信小程序组件的navigator

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Prototype Object对象 学习
Jul 12 Javascript
js解析xml字符串和xml文档实现原理及代码(针对ie与火狐)
Feb 02 Javascript
JavaScript获取当前网页最后修改时间的方法
Apr 03 Javascript
JavaScript判断变量是否为数组的方法(Array)
Feb 24 Javascript
AngularJS基础 ng-options 指令详解
Aug 02 Javascript
Node.js中常规的文件操作总结
Oct 13 Javascript
扩展Bootstrap Tooltip插件使其可交互的方法
Nov 07 Javascript
基于vue实现多引擎搜索及关键字提示
Mar 16 Javascript
详解angularJs中关于ng-class的三种使用方式说明
Jun 02 Javascript
Vue.js组件通信的几种姿势
Oct 23 Javascript
Vue实现PopupWindow组件详解
Apr 28 Javascript
Vue中UI组件库之Vuex与虚拟服务器初识
May 07 Javascript
在vue项目中使用Nprogress.js进度条的方法
Jan 31 #Javascript
pace.js和NProgress.js两个加载进度插件的一点小总结
Jan 31 #Javascript
微信小程序App生命周期详解
Jan 31 #Javascript
jQuery NProgress.js加载进度插件的简单使用方法
Jan 31 #jQuery
微信小程序switch组件使用详解
Jan 31 #Javascript
vue项目中导入swiper插件的方法
Jan 30 #Javascript
微信小程序实现手势图案锁屏功能
Jan 30 #Javascript
You might like
晋城吧对DiscuzX进行的前端优化要点
2010/09/05 PHP
php求两个目录的相对路径示例(php获取相对路径)
2014/03/27 PHP
跟我学Laravel之请求(Request)的生命周期
2014/10/15 PHP
Symfony模板的快捷变量用法实例
2016/03/17 PHP
YII框架模块化处理操作示例
2019/04/26 PHP
one.php 多项目、函数库、类库 统一为一个版本的方法
2020/08/24 PHP
(JS实现)MapBar中坐标的加密和解密的脚本
2007/05/16 Javascript
javascript 事件查询综合 推荐收藏
2010/03/10 Javascript
bootstrap-treeview自定义双击事件实现方法
2016/01/09 Javascript
Web Uploader文件上传插件使用详解
2016/05/10 Javascript
javascript的document中的动态添加标签实现方法
2016/10/24 Javascript
微信小程序 自己制作小组件实例详解
2016/12/22 Javascript
JS实现密码框的显示密码和隐藏密码功能示例
2016/12/26 Javascript
jQuery中可见性过滤器简单用法示例
2018/03/31 jQuery
小程序实现列表多个批量倒计时
2021/01/29 Javascript
[01:35]2014DOTA2西雅图邀请赛 专访狐狸妈青春献给刀塔
2014/07/08 DOTA
[01:00]一分钟回顾2018DOTA2亚洲邀请赛现场活动
2018/04/07 DOTA
[01:48]帕吉至宝加入游戏,遗迹战场现“千劫神屠”
2018/04/07 DOTA
Python获取指定字符前面的所有字符方法
2018/05/02 Python
Python创建一个空的dataframe,并循环赋值的方法
2018/11/08 Python
Python小游戏之300行代码实现俄罗斯方块
2019/01/04 Python
解决Jupyter Notebook使用parser.parse_args出现错误问题
2020/04/20 Python
Tensorflow中的降维函数tf.reduce_*使用总结
2020/04/20 Python
基于python实现上传文件到OSS代码实例
2020/05/09 Python
C语言变量的命名规则都有哪些
2013/12/27 面试题
实习自我鉴定范文
2013/10/30 职场文书
环境科学专业个人求职信
2013/12/15 职场文书
哈理工毕业生的求职信
2013/12/22 职场文书
老公给老婆的道歉信
2014/01/10 职场文书
八一演出活动方案
2014/02/03 职场文书
社会治安综合治理管理责任书
2014/04/16 职场文书
学习优秀共产党员先进事迹思想报告
2014/09/17 职场文书
2014年学生会个人工作总结
2014/11/07 职场文书
违纪检讨书范文
2015/01/27 职场文书
创业计划书之蛋糕店
2019/08/29 职场文书
详解overflow:hidden的作用(溢出隐藏、清除浮动、解决外边距塌陷)
2021/07/01 HTML / CSS