微信小程序 生命周期函数详解


Posted in Javascript onMay 24, 2017

微信小程序 生命周期函数

小程序中 判断当前首页是从其他页面返回,还是由入口打开

由于小程序的数据在我们退出小程序时并没有得到释放,因此再次点击开来数据依然没有变成初始化
解决方法:在小程序 data 数据中声明一个变量 isClose 默认为 true 用于判断 是否为从入口打开,当点击跳转页面或者关闭小程序的时候,会触发 OnHide 函数在此函数中将判断 isClose is true 的时候即为关闭之后在打开,当跳转页面时首先将 isClose 设置为 false, 这样 触发 OnHide 函数的时候,isClose is flase 并不会执行,进入跳转的页面,然后在由页面进行返回这是会触发跳转的页面的 OnUnload 函数 在此函数中 设置一个定时器 在 200ms 之后将 isClose 改为 true 这样当关闭小程序 再次进入的时候 isColse 依然为true 判断时是首次进入页面

微信小程序的生命周期函数

1.1 监听页面加载

onLoad: function (options) {},

一个页面只会调用一次,可以在 onLoad 中获取打开当前页面所调用的 query 参数。

1.2 监听页面初次渲染完成

onReady: function () {},

一个页面只会调用一次,代表页面已经准备妥当,可以和视图层进行交互。

1.3 监听页面显示

onShow: function () {},

每次打开页面都会调用一次。

1.3 监听页面隐藏

onHide: function () {},

当navigateTo或底部tab切换时调用。

1.4 监听页面卸载

onUnload: function () {},

当redirectTo或navigateBack的时候调用。

微信小程序的 app.js 中 独有的 函数

2.1 监听小程序初始化

onLaunch:function () {},

当小程序初始化完成时,会触发 onLaunch(全局只触发一次)

2.2 错误监听函数

onError:function () {},

当小程序发生脚本错误,或者 api 调用失败时,会触发 onError 并带上错误信息

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
网页javascript精华代码集
Jan 24 Javascript
Javascript load Page,load css,load js实现代码
Mar 31 Javascript
js Form.elements[i]的使用实例
Nov 13 Javascript
动态改变div的z-index属性的简单实例
Aug 08 Javascript
JQuery的ON()方法支持的所有事件罗列
Feb 28 Javascript
基于jquery实现动态竖向柱状条特效
Feb 12 Javascript
全面了解js中的script标签
Jul 04 Javascript
一篇看懂vuejs的状态管理神器 vuex状态管理模式
Apr 20 Javascript
jquery根据name取得select选中的值实例(超简单)
Jan 25 jQuery
解决jquery有正确返回值但不执行success函数的问题
Aug 20 jQuery
node.js实现为PDF添加水印的示例代码
Dec 05 Javascript
elementUI select组件使用及注意事项详解
May 29 Javascript
很棒的vue弹窗组件
May 24 #Javascript
详解Vue使用命令行搭建单页面应用
May 24 #Javascript
详解Vue 非父子组件通信方法(非Vuex)
May 24 #Javascript
微信小程序 支付功能(前端)的实现
May 24 #Javascript
微信小程序 选项卡的简单实例
May 24 #Javascript
JS回调函数基本定义与用法实例分析
May 24 #Javascript
解决jQuery ajax动态新增节点无法触发点击事件的问题
May 24 #jQuery
You might like
apache+codeigniter 通过.htcaccess做动态二级域名解析
2012/07/01 PHP
解析PHP 5.5 新特性
2013/07/02 PHP
php reset() 函数指针指向数组中的第一个元素并输出实例代码
2016/11/21 PHP
php中实现字符串翻转的方法
2017/02/22 PHP
使用CSS3实现字体颜色渐变的实现
2021/03/09 HTML / CSS
js中使用DOM复制(克隆)指定节点名数据到新的XML文件中的代码
2011/07/27 Javascript
jquery删除数据记录时的弹出提示效果
2014/05/06 Javascript
jQuery实现响应浏览器缩放大小并改变背景颜色
2014/10/31 Javascript
JavaScript中的数值范围介绍
2014/12/29 Javascript
jQuery表单域选择器用法分析
2015/02/10 Javascript
JavaScript实现横向滑出的多级菜单效果
2015/10/09 Javascript
jQuery实现可拖拽的许愿墙效果【附demo源码下载】
2016/09/14 Javascript
javascript 中的事件委托详解
2016/10/25 Javascript
详解nodejs 文本操作模块-fs模块(一)
2016/12/22 NodeJs
正则验证小数点后面只能有两位数的方法
2017/02/28 Javascript
微信小程序 聊天室简单实现
2017/04/19 Javascript
Angular4表单验证代码详解
2017/09/03 Javascript
微信小程序时间轴实现方法示例
2019/01/14 Javascript
AngularJS实现的鼠标拖动画矩形框示例【可兼容IE8】
2019/05/17 Javascript
微信小程序开发常见问题及解决方案
2019/07/11 Javascript
vue路由结构可设一层方便动态添加路由操作
2020/08/31 Javascript
关于better-scroll插件的无法滑动bug(2021通过插件解决)
2021/03/01 Javascript
vue 数据双向绑定的实现方法
2021/03/04 Vue.js
haskell实现多线程服务器实例代码
2013/11/26 Python
对python sklearn one-hot编码详解
2018/07/10 Python
python 实现数字字符串左侧补零的方法
2018/12/04 Python
python3使用print打印带颜色的字符串代码实例
2019/08/22 Python
结合CSS3的新特性来总结垂直居中的实现方法
2016/05/30 HTML / CSS
CSS3 实现时间轴动画
2020/11/25 HTML / CSS
HTML5标签使用方法详解
2015/11/27 HTML / CSS
澳大利亚领先的优质葡萄酒拍卖会:Langton’s Fine Wines
2019/03/24 全球购物
2015年出纳个人工作总结
2015/04/02 职场文书
2015年环保局工作总结
2015/05/22 职场文书
心灵点滴观后感
2015/06/02 职场文书
看看如何用Python绘制小米新版天价logo
2021/04/20 Python
Python可视化学习之seaborn调色盘
2022/02/24 Python