009 ∞ 生命周期函数和页面事件处理函数

不二如是

                               
登录/注册后可看大图

上一讲我们介绍了page（）的玩法，本次看一看提到的生命周期函数。

生命周期顾名思义，从打开小程序到用户最终关上小程序的过程就是一个使用生命周期。

                               
登录/注册后可看大图

可以细化为：

onLoad (页面加载): 一个页面只会调用一次，可以在 onLoad 中获取打开当前页面所调用的 query 参数。

onShow (页面显示): 每次打开页面都会调用一次。

onReady (页面初次渲染完成): 一个页面只会调用一次，代表页面已经准备妥当，可以和视图层进行交互。对界面的设置如wx.setNavigationBarTitle请在onReady之后设置。

onHide (页面隐藏): 当navigateTo或底部tab切换时调用。

onUnload (页面卸载): 当redirectTo或navigateBack的时候调用

生命周期的调用以及页面的路由方式，本次先不介绍，后续再来～

主要介绍一下onLoad参数：

类型	说明
Object	其他页面打开当前页面所调用的 query 参数

---

页面事件处理函数

页面事件处理，顾名思义，发生在小程序页中由用户产生的操作行为。

像下拉刷新，上拉触顶，页面滚动...都可以是。

onPullDownRefresh，下拉刷新：

监听用户下拉刷新事件。

需要在app.json的window选项中或页面配置中开启enablePullDownRefresh。

当处理完数据刷新后，wx.stopPullDownRefresh可以停止当前页面的下拉刷新。

onReachBottom，上拉触底：

监听用户上拉触底事件。

可以在app.json的window选项中或页面配置中设置触发距离onReachBottomDistance。

在触发距离内滑动期间，本事件只会被触发一次。

onPageScroll，页面滚动 ：

监听用户滑动页面事件。

参数为 Object，包含以下字段：

字段	类型	说明
scrollTop	Number	页面在垂直方向已滚动的距离（单位px）

onShareAppMessage，用户转发 ：

只有定义了此事件处理函数，右上角菜单才会显示“转发”按钮

用户点击转发按钮的时候会调用

此事件需要 return 一个 Object，用于自定义转发内容

自定义转发字段 ：

字段	说明	默认值
title	转发标题	当前小程序名称
path	转发路径	当前页面 path ，必须是以 / 开头的完整路径

看完上面这些方法，举一个例子：

当用户在转发时，小程序标题标题为“我爱鱼C”，路径为"/page/user?id=666"

可以在index.js中添加：

1. onShareAppMessage: function () {
   
2.     return {
   
3.       title: '我爱鱼C',
   
4.       path: '/page/user?id=666'
   
5.     }
   
6.   }

复制代码

---

课后作业


1、下列选项中符合“一个页面只会调用一次”的要求的选项是？
a.onShow  b.onReady  c.onLoad  d.onShut

2、补充代码：

1. Page({
   
2. ？  : function () {
   
3.     return {
   
4.       title: '自定义转发标题',
   
5.      ？ : '/page/user?id=333'
   
6.     ？
   
7.   }
   
8. 
   
9. })

复制代码

答案：

游客，如果您要查看本帖隐藏内容请回复

---

如果有收获，别忘了评分 ：

                               
登录/注册后可看大图

这位鱼油，如果喜欢小程序，请订阅 专辑☞（传送门）（不喜欢更要订阅 ）

                               
登录/注册后可看大图

yangxiaoyan

答案

一笙彤

c

宇宙奔奔

ShmilyLee

c
onShareAppMessage  path  }

又新

111