马上注册,结交更多好友,享用更多功能^_^
您需要 登录 才可以下载或查看,没有账号?立即注册
x
本帖最后由 不二如是 于 2018-5-12 14:18 编辑
上一讲我们介绍了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中添加:onShareAppMessage: function () {
return {
title: '我爱鱼C',
path: '/page/user?id=666'
}
}
课后作业
1、下列选项中符合“一个页面只会调用一次”的要求的选项是?
a.onShow b.onReady c.onLoad d.onShut
2、补充代码:Page({
? : function () {
return {
title: '自定义转发标题',
? : '/page/user?id=333'
?
}
})
答案:
如果有收获,别忘了评分 :
这位鱼油,如果喜欢小程序,请订阅 专辑☞( 传送门)( 不喜欢更要订阅 )
|