uniapp中的生命周期
一蹂喻、應用生命周期(注意:只可在App.vue中監(jiān)聽)
- 1.onLaunch:當 uni-app 初始化完成時觸發(fā)(全局只觸發(fā)一次)
- 2.onShow :當 uni-app 啟動站楚,或從后臺進入前臺顯示 //監(jiān)聽用戶進入小程序
- 3.onHide :當 uni-app 從前臺進入后臺 //監(jiān)聽用戶離開小程序
- 4.onError :當 uni-app 報錯時觸發(fā)
- 5.onUniNViewMessage :對 nvue 頁面發(fā)送的數據進行監(jiān)聽
二窘游、頁面生命周期(在頁面中添加)
1.onLoad
(監(jiān)聽頁面加載)
2.onShow
(監(jiān)聽頁面顯示)
3.onReady
(監(jiān)聽頁面初次渲染完成)
4.onHide
(監(jiān)聽頁面隱藏)
5.onUnload
:監(jiān)聽頁面卸載
6.onResize
:監(jiān)聽窗口尺寸變化
7.onPullDownRefresh
:監(jiān)聽用戶下拉動作试躏,一般用于下拉刷新
當頁面中需要用到下拉刷新
功能時晶伦,打開pages.json
神帅,在"globalStyle
"里設置"enablePullDownRefresh":true
此時所有頁面都可以完成下拉刷新功能
如果想在單個頁面中不執(zhí)行刷新功能:在pages.json
里單個頁面上添加
如果想在單個頁面中執(zhí)行刷新功能:在pages.json
里單個頁面上添加
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "首頁",
"enablePullDownRefresh":true
}
},
"enablePullDownRefresh":true
8.onReachBottom
:頁面滾動到底部的事件(不是scroll-view滾到底)罕容,常用于下拉下一頁數據
9.onTabItemTap
:點擊 tabBar 時觸發(fā)
10.onShareAppMessage
:用戶點擊右上角分享
可以在轉發(fā)時設置轉發(fā)標題,路徑和圖片
11.onPageScroll
:監(jiān)聽頁面滾動
12.onNavigationBarButtonTap
:監(jiān)聽原生標題欄按鈕點擊事件
13.onBackPress
:監(jiān)聽頁面返回
14.onNavigationBarSearchInputChanged
:監(jiān)聽原生標題欄搜索輸入框輸入內容變化事件
15.onNavigationBarSearchInputConfirmed
:監(jiān)聽原生標題欄搜索輸入框搜索事件高帖,用戶點擊軟鍵盤上的“搜索”按鈕時觸發(fā)
16.onNavigationBarSearchInputClicked
:監(jiān)聽原生標題欄搜索輸入框點擊事件
onLoad() {
console.log('頁面加載')
},
onShow() {
console.log('頁面顯示')
},
onReady(){
console.log('頁面初次顯示')
},
onHide() {
console.log('頁面隱藏')
},
onUnload() {
console.log('頁面卸載')
},
onBackPress(){
console.log('頁面返回...')
},
onShareAppMessage() {
console.log('分享!')
},
onReachBottom() {
console.log('下拉加載...')
},
onPageScroll(){
console.log('頁面滾動...')
},
onPullDownRefresh() {
console.log('上拉刷新...')
uni.stopPullDownRefresh();
},
組件生命周期(與vue標準組件的生命周期相同)
1.beforeCreate
:在實例初始化之后被調用
2.created
:在實例創(chuàng)建完成后被立即調用
3.beforeMount
:在掛載開始之前被調用
該鉤子在服務器端渲染期間不被調用缰儿。
使用方法:在主頁面中引入組件,在組件中寫
4.mounted
:掛載到實例上去之后調用(該鉤子在服務器端渲染期間不被調用)
注意 mounted 不會保證所有的子組件也都一起被掛載散址。如果你希望等到整個視圖都渲染完畢乖阵,
可以在 mounted 內部使用vm.$nextTick:
mounted: function () {
this.$nextTick(function () {
// Code that will run only after the
// entire view has been rendered
})
}
5.beforeUpdate
:數據更新時調用,發(fā)生在虛擬 DOM 打補丁之前(該鉤子在服務器端渲染期間不被調用预麸,因為只有初次渲染會在服務端進行)
6.updated
:由于數據更改導致的虛擬 DOM 重新渲染和打補丁义起,在這之后會調用該鉤子(該鉤子在服務器端渲染期間不被調用)
7.beforeDestroy
:實例銷毀之前調用。在這一步师崎,實例仍然完全可用(該鉤子在服務器端渲染期間不被調用)
8.destroyed
:Vue 實例銷毀后調用(該鉤子在服務器端渲染期間不被調用)