uni-app学习之生命周期
7.1生命周期介绍1.uni-app框架的生命周期结合了vue和微信小程序的生命周期2.全局的app中使用onlaunch表示启动应用时3.页面中使用onload或者onshow分别表示页面加载完毕时和页面显示时4.组件中使用mounted组件挂载完毕时第一步:首先在文件app.vue中键入命令onLaunch: function() {console.log('App Launch 应用启动')
7.1
生命周期介绍
1.uni-app框架的生命周期结合了vue和微信小程序的生命周期
2.全局的app中使用onlaunch表示启动应用时
3.页面中使用onload或者onshow分别表示页面加载完毕时和页面显示时
4.组件中使用mounted组件挂载完毕时
第一步:首先在文件app.vue中键入命令
onLaunch: function() {
console.log('App Launch 应用启动')
//其实这里只键入了“应用启动”四个字
},
// 应用被触发了
然后在index.vue中的export模块内键入命令
onLoad(){
console.log("页面加载完毕")
}
然后在运行过程中可以看到先显示“App Launch 应用启动”之后显示“页面加载完毕”
仍然是如此操作,实验第二个生命周期,onshow,仍然是如此同理
但是在第三个实验的时候,我们可以试一试在插件上挂载生命周期,就会发现能够成功运行
<script>
export default {
onLoad(){
console.log("my-form onLoad");
},
mounted() {
console.log("myform mounted");
}
}
</script>
7.2
完整的生命周期
onlaunch 当uni-app初始化完成时触发(全局只触发一次)
onShow 当uni-app启动,从后台进入前台时显示
onHide 当uni-app从前台进入后台时显示
onError 当uni-app报错时触发
onUniNViewMessage 对nuve页面发送的数据进行监听
页面生命周期
onload 监听页面加载,其参数为上个页面传递的数据,参数类型为PObject(用于页面传参)
onShow 监听页面显示,页面每次出现在屏幕上都触发,包括从下级页面点返回露出当前页面
onReady 监听页面初次渲染完成,注意如果渲染速度快,会在页面进入动画完成前触发
onHIide 监听页面隐藏
onUnload 监听页面卸载
onResize 监听窗口尺寸变化
onPullDownRefresh 监听用户下拉动作,一般用于下拉刷新
onReachBotton 页面上啦触及事件的处理函数
具体详见 https://uniapp.dcloud.io/tutorial/page.html#lifecycle
生命周期就几个常用的
更多推荐
所有评论(0)