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


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 自定义类型方法小结
Mar 02 Javascript
JavaScript 以对象为索引的关联数组
May 19 Javascript
JavaScript 节流函数 Throttle 详解
Jul 04 Javascript
bootstrap选项卡使用方法解析
Jan 11 Javascript
Javascript 两种刷新方法以及区别和适用范围
Jan 17 Javascript
js实现滑动到页面底部自动加载更多功能
Feb 15 Javascript
js轮播图透明度切换(带上下页和底部圆点切换)
Apr 27 Javascript
JS判断非空至少输入两个字符的简单实现方法
Jun 23 Javascript
Vue父子组建的简单通信之控制开关Switch的实现
Jun 04 Javascript
JS根据json数组多个字段排序及json数组常用操作
Jun 06 Javascript
8 个有用的JS技巧(推荐)
Jul 03 Javascript
浅谈Vue 函数式组件的使用技巧
Jun 16 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 stream_get_meta_data返回值
2013/09/29 PHP
PHP读取文件内容后清空文件示例代码
2014/03/18 PHP
PHP贪婪算法解决0-1背包问题实例分析
2015/03/23 PHP
静态的动态续篇之来点XML
2006/12/23 Javascript
将CKfinder整合进CKEditor3.0的新方法
2010/01/10 Javascript
jQuery+ajax实现顶一下,踩一下效果
2010/07/17 Javascript
js检查页面上有无重复id的实现代码
2013/07/17 Javascript
jquery.cookie() 方法的使用(读取、写入、删除)
2013/12/05 Javascript
js转化毫秒为时间格式代码
2014/04/10 Javascript
jQuery 写的简单打字游戏可以提示正确和错误的次数
2014/07/01 Javascript
jQuery的text()方法用法分析
2014/12/20 Javascript
XMLHttpRequest Level 2 使用指南
2016/08/26 Javascript
讲解vue-router之什么是编程式路由
2018/05/28 Javascript
bootstrap与pagehelper实现分页效果
2018/12/29 Javascript
layui数据表格 table.render 报错的解决方法
2019/09/29 Javascript
原生javascript的ajax请求及后台PHP响应操作示例
2020/02/24 Javascript
python批量下载图片的三种方法
2013/04/22 Python
go和python调用其它程序并得到程序输出
2014/02/10 Python
用Python登录好友QQ空间点赞的示例代码
2017/11/04 Python
python 字符串的驻留机制及优缺点
2020/06/19 Python
基于Tensorflow读取MNIST数据集时网络超时的解决方式
2020/06/22 Python
基于python实现操作redis及消息队列
2020/08/27 Python
CSS3色彩模式有哪些?CSS3 HSL色彩模式的定义
2016/04/26 HTML / CSS
Reebonz中国官网:新加坡奢侈品购物网站
2017/03/17 全球购物
科颜氏英国官网:Kiehl’s英国
2019/11/20 全球购物
Linux面试经常问的文件系统操作命令
2016/10/04 面试题
AJAX都有哪些有点和缺点
2012/11/03 面试题
学期研究性学习个人的自我评价
2014/01/09 职场文书
乔丹名人堂演讲稿
2014/05/24 职场文书
党员目标管理责任书
2014/07/25 职场文书
2015年中学元旦晚会活动方案
2014/12/09 职场文书
班主任自我评价范文
2015/03/11 职场文书
建筑工程材料员岗位职责
2015/04/11 职场文书
小学班主任培训心得体会
2016/01/07 职场文书
Python爬取英雄联盟MSI直播间弹幕并生成词云图
2021/06/01 Python
mysql timestamp比较查询遇到的坑及解决
2021/11/27 MySQL