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


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 相关文章推荐
javascript json2 使用方法
Mar 16 Javascript
用jquery与css打造个性化的单选框和复选框
Oct 20 Javascript
JavaScript中获取样式的原生方法小结
Oct 08 Javascript
javascript实现iframe框架延时加载的方法
Oct 30 Javascript
jQuery提示效果代码分享
Nov 20 Javascript
JavaScript中创建字典对象(dictionary)实例
Mar 31 Javascript
全面解析Bootstrap表单使用方法(表单样式)
Nov 24 Javascript
文件上传的几个示例分享【推荐】
Dec 16 Javascript
jquery无法为动态生成的元素添加点击事件的解决方法(推荐)
Dec 26 Javascript
jQuery密码强度验证控件使用详解
Jan 05 Javascript
Vue通过getAction的finally来最大程度避免影响主数据呈现问题
Apr 24 Javascript
JavaScript展开运算符和剩余运算符的区别详解
Feb 18 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
php 生成文字png图片的代码
2011/04/17 PHP
php使用ffmpeg获取视频信息并截图的实现方法
2016/05/03 PHP
PHP读取CSV大文件导入数据库的实例
2017/07/24 PHP
什么是PHP7中的孤儿进程与僵尸进程
2019/04/14 PHP
php变量与字符串的增删改查操作示例
2020/05/07 PHP
利用js制作html table分页示例(js实现分页)
2014/04/25 Javascript
详解Angularjs filter过滤器
2016/02/06 Javascript
AngularJS递归指令实现Tree View效果示例
2016/11/07 Javascript
jquery实现下拉框多选方法介绍
2017/01/03 Javascript
JavaScript的事件机制详解
2017/01/17 Javascript
详解Angular2 之 结构型指令
2017/06/21 Javascript
JQuery用$.ajax或$.getJSON跨域获取JSON数据的实现代码
2017/09/23 jQuery
微信小程序图片选择区域裁剪实现方法
2017/12/02 Javascript
深入探索VueJS Scoped CSS 实现原理
2019/09/23 Javascript
微信小程序图片右边加两行文字的代码
2020/04/23 Javascript
js 数据类型判断的方法
2020/12/03 Javascript
[01:03:50]DOTA2-DPC中国联赛 正赛 CDEC vs DLG BO3 第二场 2月7日
2021/03/11 DOTA
python根据路径导入模块的方法
2014/09/30 Python
利用python获取当前日期前后N天或N月日期的方法示例
2017/07/30 Python
终端命令查看TensorFlow版本号及路径的方法
2018/06/13 Python
Django Admin设置应用程序及模型顺序方法详解
2020/04/01 Python
pycharm安装及如何导入numpy
2020/04/03 Python
Html5移动端适配IphoneX等机型的方法
2019/06/25 HTML / CSS
美国半成品食材配送服务商:Home Chef
2018/01/25 全球购物
彪马英国官网:PUMA英国
2019/02/11 全球购物
卡骆驰英国官网:Crocs英国
2019/08/22 全球购物
会计专业毕业生自我评价
2013/09/25 职场文书
数控专业应届生求职信
2013/11/27 职场文书
体育专业学生自我评价范文
2014/01/17 职场文书
总经理司机岗位职责
2014/02/06 职场文书
给学校的建议书范文
2014/05/15 职场文书
幼儿园大班毕业评语
2014/12/31 职场文书
导游词300字
2015/02/13 职场文书
反腐倡廉影片观后感
2015/06/08 职场文书
python3 实现mysql数据库连接池的示例代码
2021/04/17 Python
写好Python代码的几条重要技巧
2021/05/21 Python