Page生命周期
https://developers.weixin.qq.com/miniprogram/dev/reference/api/Page.html
指的是页面的js中的Page参数。
生命周期指的是页面从打开到关闭过程中可在某一步时执行一些操作。
onLoad | function | 生命周期回调—监听页面加载 | ||
---|---|---|---|---|
onShow | function | 生命周期回调—监听页面显示 | ||
onReady | function | 生命周期回调—监听页面初次渲染完成 | ||
onHide | function | 生命周期回调—监听页面隐藏 | ||
onUnload | function | 生命周期回调—监听页面卸载 |
onLoad/onShow
js:
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
console.log("监听页面加载")
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
console.log("监听页面初次渲染完成")
},
- onLoad指的是新页面刚开始加载时就会执行指定的内容。
- onReady指的是页面第一次加载完成页面就会执行指定的内容,如果切换后台再切回来不会激发该生命周期。
onShow/onHide
- onShow在页面刚加载、从后台切换回页面、从其他页面切换回该页面时都会触发该生命周期。
onHide在从该页面切到其他地方时会触发。
/** * 生命周期函数--监听页面显示 */ onShow: function () { console.log("监听页面显示") }, /** * 生命周期函数--监听页面隐藏 */ onHide: function () { console.log("监听页面隐藏") },
Page其他动作
onUnload
onPullDownRefresh
实验
首先在demo4的json中添加允许下来刷新参数:
enablePullDownRefresh | boolean | false | 是否开启当前页面下拉刷新。 详见 Page.onPullDownRefresh |
---|
demo4.json:
{
"usingComponents": {},
"enablePullDownRefresh":true
}
demo4.js:
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
console.log("监听页面下拉刷新")
},
onReachBottom
页面上拉触底事件触发指定任务,但是页面对高度有一定的要求,否则不会触发。
实验
首先在wxml中写一个盒子,让页面具有一定的高度。
<!--pages/demo4/demo4.wxml-->
<text>pages/demo4/demo4.wxml</text>
<view style="height:1000px;background:#ccc;"></view>
js:
onReachBottom: function () {
console.log("触底了")
},
onShareAppMessage
分享时触发的事件,如果将这个参数删去,那么在页面右上角点击三个小点时就不能转发分享。
https://developers.weixin.qq.com/miniprogram/dev/reference/api/Page.html#onShareAppMessage-Object-object
参数 | 类型 | 说明 | 最低版本 |
---|---|---|---|
from | String | 转发事件来源。button :页面内转发按钮;menu :右上角转发菜单 | 1.2.4 |
target | Object | 如果 from 值是 button ,则 target 是触发这次转发事件的 button ,否则为 undefined | 1.2.4 |
webViewUrl | String | 页面中包含web-view组件时,返回当前web-view的url | 1.6.4 |
实验
这是允许分享时,点击三个小点看到的操作页。
接下来删除onShareAppMessage,再次点击。
可以看到不允许分享。
此处评论已关闭