生活随笔
收集整理的這篇文章主要介紹了
uni-app的三种生命周期函数整理
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
uni-app中有三種生命周期函數:應用生命周期、頁面生命周期、組件生命周期。
一、應用生命周期
onLaunch:當uni-app初始化完成時觸發(全局只觸發一次)onShow:當uni-app啟動,或從后臺進入前臺顯示onHide:當uni-app從前臺進入后臺onError:當uni-app報錯時觸發onUniNViewMessage:對nvue頁面發送的數據進行監聽onUnhandledRejection:對未處理的Promise拒絕事件監聽函數onPageNotFound:頁面不存在監聽函數onThemeChange:監聽系統主題變化
注意:
- 應用生命周期僅可在App.vue中監聽,在其它頁面監聽無效。
- onlaunch里進行頁面跳轉,如遇白屏報錯,請參考https://ask.dcloud.net.cn/article/35942
二、頁面生命周期
onInit:監聽頁面初始化,其參數(類型Object)為上個頁面傳遞的數據,觸發時機早于 onLoadonLoad:監聽頁面加載,其參數(類型Object)為上個頁面傳遞的數據onShow:監聽頁面顯示。頁面每次出現在屏幕上都觸發,包括從下級頁面點返回露出當前頁面onReady:監聽頁面初次渲染完成。注意如果渲染速度快,會在頁面進入動畫完成前觸發onHide:監聽頁面隱藏onUnload:監聽頁面卸載onResize:監聽窗口尺寸變化onPullDownRefresh:監聽用戶下拉動作,一般用于下拉刷新onReachBottom:頁面滾動到底部的事件(不是scroll-view滾到底),常用于下拉下一頁數據onTabItemTap:點擊 tab 時觸發,參數為ObjectonShareAppMessage:用戶點擊右上角分享onPageScroll:監聽頁面滾動,參數為ObjectonNavigationBarButtonTap:監聽原生標題欄按鈕點擊事件,參數為ObjectonBackPress:監聽頁面返回,返回 event = {from:backbutton、 navigateBack} ,backbutton 表示來源是左上角返回按鈕或 android 返回鍵;navigateBack表示來源是 uni.navigateBackonNavigationBarSearchInputChanged:監聽原生標題欄搜索輸入框輸入內容變化事件onNavigationBarSearchInputConfirmed:監聽原生標題欄搜索輸入框搜索事件,用戶點擊軟鍵盤上的“搜索”按鈕時觸發。onNavigationBarSearchInputClicked:監聽原生標題欄搜索輸入框點擊事件onShareTimeline:監聽用戶點擊右上角轉發到朋友圈onAddToFavorites:監聽用戶點擊右上角收藏
注意:
- 使用uni-app里面的onReady 代替 vue 里面的 mounted
- 使用uni-app里面的onLoad 代替 vue 里面的 created
三、組件生命周期
uni-app 組件支持的生命周期,與vue標準組件的生命周期相同。這里沒有頁面級的onLoad等生命周期:
beforeCreate:在實例初始化之后被調用created:在實例創建完成后被立即調用beforeMount:在掛載開始之前被調用mounted:掛載到實例上去之后調用。注意:此處并不能確定子組件被全部掛載,如果需要子組件完全掛載之后在執行操作可以使用$nextTickbeforeUpdate:數據更新時調用,發生在虛擬 DOM 打補丁之前updated:由于數據更改導致的虛擬 DOM 重新渲染和打補丁,在這之后會調用該鉤子beforeDestroy:實例銷毀之前調用。在這一步,實例仍然完全可用destroyed:Vue 實例銷毀后調用。調用后,Vue 實例指示的所有東西都會解綁定,所有的事件監聽器會被移除,所有的子實例也會被銷毀
總結
以上是生活随笔為你收集整理的uni-app的三种生命周期函数整理的全部內容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。