uni生命周期函数
应用的生命周期
函数名 | 说明 |
---|---|
onLaunch | 当uni-app 初始化完成时触发(全局只触发一次) |
onShow | 当 uni-app 启动,或从后台进入前台显示 |
onHide | 当 uni-app 从前台进入后台 |
onError | 当 uni-app 报错时触发 |
示例代码
<script>
export default {
//只能在App.vue中监听!
onLaunch: function() {
console.log('App Launch');
},
onShow: function() {
console.log('App Show');
},
onHide: function() {
console.log('App Hide');
}
};
</script>
页面生命周期
函数名 | 说明 |
---|---|
onLoad | 监听页面加载,其参数为上个页面传递的数据,参数类型为Object(用于页面传参) |
onShow | 监听页面显示 |
onReady | 监听页面初次渲染完成。注意如果渲染速度快,会在页面进入动画完成前触发 |
onHide | 监听页面隐藏 |
onUnload | 监听页面卸载 |
onResize | 监听窗口尺寸变化 |
onPullDownRefresh | 监听用户下拉动作,一般用于下拉刷新 |
onReachBottom | 页面滚动到底部的事件(不是scroll-view滚到底),常用于下拉下一页数据。具体见下方注意事项 |
onTabItemTap | 点击 tab 时触发,参数为Object,具体见下方注意事项 |
onShareAppMessage | 用户点击右上角分享 |
代码示例
export default {
onLoad() {
console.log('页面初始化执行一次 onload')
},
onReady() {
console.log('页面加载完毕 执行一次 onReady')
},
onShow() {
console.log('页面进入执行 执行多次 onShow')
},
onHide() {
console.log('页面进入离开 执行多次 onHide')
},
onPullDownRefresh() {
console.log('用户执行了下拉刷新')
},
onTabItemTap() {
console.log('用户点击了tabbar')
},
onShareAppMessage() {
console.log('用户点击了分享')
//分享页面的设置
return {
title:"",
path:"",
imageUrl:""
}
}
}
下拉刷新
在pages.json
中,在globalStyle属性配置
enablePullDownRefresh`,即所有页面都能下拉刷新
"globalStyle": {
"navigationBarTextStyle": "white"