uni-app的生命周期

203 阅读1分钟

uni-app的生命周期

  1. 应用程序的生命周期:应用程序的生命周期只能写到 App.vue 里,在其他页面里监听无效。

    onLaunch: function() { //当 uni-app 程序初始化完成时触发,在整个程序运行期间只执行一次 console.log('App Launch') },

    onShow: function() { // 当 uni-app 启动,从后台进入前台时触发 console.log('App Show') },

    onHide: function() { // 当 uni-app 从前台进入到后台时触发 console.log('App Hide') }

  2. 页面的生命周期

  • 页面初始化时,首页触发的是onLoad、onShow、onReady三个生命周期函数,在这个三个生命周期中均可获得data中的数据

  • 通过tabbar切换页面,页面不会被销毁,只会触发onHide

  • 通过navigator进入页面,当前页触发onLoad、onShow、onReady,从目标页返回时,触发onUnload,页面被销毁。

  1. 组件的生命周期:组件的生命周期,参考vue的标准生命周期。
  • 当组件所在的页面被加载时,先触发页面的 onLoad、onShow ,然后再执行组件的 beforeCreate、created、beforeMount、mounted ,最后触发页面的 onReady 函数。
  • 当组件所在的页面被销毁时,先触发页面的 onUnload ,之后触发组件的 beforeDestory 和 destroyed ,最后一级页面才触发 onShow

总结:

  • page页面建议使用微信小程序的生命周期
  • 组件建议使用vue的生命周期