小程序生命周期分为应用生命周期和页面生命周期

1、Onload:页面加载时触发,一般在onLoad中发送异步请求来初始化页面数据。

2、onShow:页面显示时触发

3、onReady:页面初次渲染完成时触发。

4、onHide:是页面隐藏时触发,注意不是应用隐藏,切后台时,页面就会隐藏。即整个小程序隐藏时,页面也就隐藏了。另外,在当前页面跳转的时候也相当于当前页面隐藏。

5、onUpload:页面卸载(关闭)时触发,当open-type为redirect,reLaunch,navigateBack时都是关闭当前页面,也即卸载当前页面。

6、onPullDownRefresh:监听用户的下拉动作,当在app.json中配置了允许下拉刷新,在页面中往下拉动就会有下拉刷新的效果。还可以设置下拉刷新时的背景颜色。

下拉刷新时往往需要对页面数据就行初始化,重新发请求来拿数据。

7、onReachBottom:页面上拉触底时才会触发。 如果页面高度不够,就不会发生滚动,也就没有页面上拉触底。故需要让页面出现上下滚动才行。

如何才能实现页面出现上下滚动呢?加一堆view标签就可以了。输入view{$}*100,就会出现100个标签。

在onReachBottom中做上拉加载下一页数据的操作

8、onShareAPPMessage:用户点击右上角转发的时候才会触发,点击右上角的三个点就会弹出转发按钮。点击转发按钮后,由于应用和页面都被隐藏了,所以打印效果如下。

9、onPageScroll:表示页面滚动就可以触发,

10、onResize:页面尺寸改变时触发。由于手机屏幕是固定的,这种情况很少发生,但在小程序发生横屏和竖屏切换时会触发。使小程序中的页面支持屏幕旋转的方法是:在app.json的window段中设置“pageOrientation”:“auto”,这样所有页面都可以发生屏幕旋转,或在页面json文件中配置“pageOrientation”:“auto”,这样只有当前页面发生屏幕旋转。

11、onTabItemTap:当前是标签页(顶部或底部有tabBar的页面),再点击自己的tab item时才会触发。如当前页是标签页demo4,在tabBar中点击demo4时才会触发。而点击其他的Tab item则不会触发。

先使当前页面变成tabBar页面,即在app.json的tabBar中在新增一项

微信小程序:页面生命周期的更多相关文章

  1. 微信小程序之生命周期(三)

    [未经作者本人同意,请勿以任何形式转载] 上一篇介绍微信小程序开发工具使用和项目目录结构. 这一章节介绍微信小程序的生命周期,什么是生命周期呢? 通俗的讲,生命周期就是指一个对象的生老病死. 从软件的 ...

  2. [转] 微信小程序之生命周期

    本篇文章介绍小程序的生命周期,由于小程序分为应用和页面两个部分,所以小程序的生命周期就涉及到三个部分,分别是: 应用的生命周期 页面的生命周期 应用的生命周期对页面生命周期的影响 一.应用的生命周期 ...

  3. 教你理解微信小程序的生命周期和运行原理

    转自:http://blog.csdn.net/tsr106/article/details/53052879  写微信小程序,他的生命周期不能不知道,不知道小程序就会出现各种bug而无法解决.小助君 ...

  4. 理解微信小程序的生命周期和运行原理

    写微信小程序,他的生命周期不能不知道,不知道小程序就会出现各种bug而无法解决.小助君公众号带你学习小程序的生命周期和运行原理. 小程序由两大线程组成:负责界面的线程(view thread)和服务线 ...

  5. 微信小程序的生命周期和APP对象的使用

    1.生命周期和APP对象的使用: //app.js App({ onLaunch: function () { //调用API从本地缓存中获取数据 var logs = wx.getStorageSy ...

  6. 微信小程序-APP生命周期与运行机制

    QQ讨论群:785071190 开发微信小程序之前需要先了解微信小程序运行机制以及其生命周期,小程序APP生命周期需要先从app.js这个文件开始. 阅读过"微信小程序-代码构成" ...

  7. 微信小程序APP生命周期

    小程序APP生命周期需要先从app.js这个文件开始,App() 必须在 app.js 中调用,必须调用且只能调用一次,app.js中定义了一些应用的生命周期函数 onLaunch----当小程序初始 ...

  8. 微信小程序-Page生命周期

    QQ讨论群:785071190 微信小程序开发之前我们还需认识一下小程序页面的生命周期,丛"微信小程序-代码构成"一文中我们可以了解到小程序页面中有一个.js的文件,这篇博文我们来 ...

  9. 对微信小程序的生命周期进行扩展 – Typescript 篇

    最近利用业余时间倒腾了一个微信小程序,主要目的是横向比较一些业界小程序平台的架构和做法.因为有在其他平台长期的开发经验,对于小程序的一些机制做了一些辩证的思考.例如,小程序的页面,其实不是一个页面,而 ...

  10. 微信小程序之生命周期

    1. 整个小程序生命周期 App({}) //app.js App({ onLaunch: function (options) { // 小程序初始化完成时(全局只触发一次) // 程序销毁(过一段 ...

随机推荐

  1. 【函数分享】每日PHP函数分享(2021-2-5)

    array_column - 返回数组中指定的一列 说明: array_column ( array $input , mixed $column_key , mixed $index_key = n ...

  2. Scala数据结构(数组,Map和Tuple)

    package com.zy import scala.collection.mutable import scala.collection.mutable.ArrayBuffer object te ...

  3. 2018 ACM-ICPC 焦作区域赛 E Resistors in Parallel

    Resistors in Parallel Gym - 102028E 吐槽一下,网上搜索的题解一上来都是找规律,对于我这种对数论不敏感的人来说,看这种题解太难受了,找规律不失为一种好做法,但是题解仅 ...

  4. hdu3559 Frost Chain (概率dp+记忆化搜索)

    Problem Description In the unimaginable popular DotA game, the hero Lich has a wonderful skill: Fros ...

  5. 树链剖分(附带LCA和换根)——基于dfs序的树上优化

    .... 有点懒: 需要先理解几个概念: 1. LCA 2. 线段树(熟练,要不代码能调一天) 3. 图论的基本知识(dfs序的性质) 这大概就好了: 定义: 1.重儿子:一个点所连点树size最大的 ...

  6. hdu2639 Bone Collector II

    Problem Description The title of this problem is familiar,isn't it?yeah,if you had took part in the ...

  7. solidity的函数修改器(modifier)

    内容:modifier的定义.modifier对函数参数的操作.modifier执行的顺序 modifier的定义 官方文档:modifier可以改变函数的行为.可以被继承和重写. 其实modifie ...

  8. PowerShell启用多跳远程控制

    有些场景下,我们使用远程连接了某个Server,在远程Server中再想进行远程操作,就会提示错误.因为默认的认证信息只会传递一跳. 对此,微软官方文档给出的解决方案是:https://docs.mi ...

  9. IOS键盘收起后,页面底部留白处理

    环境:vue+vant 的H5页面 场景:输入框输入信息时,如登录.注册等表单信息 问题:键盘收回后页面底部留白,导致dialog组件按钮位移,视觉上,其中的按钮无法正常工作 解决方案:监听失去焦点时 ...

  10. spring-cloud-netflix-eureka-client

    服务注册中心eureka-server已经搭好,我们开始编写一个eureka-client,并提供一个hello服务 一.新建module,选择对应的springcloud模块,pom.xml如下: ...