uniapp入門(三——生命周期)

uniapp組成(生命周期)

應用注冊 App


獲取用戶進入或者離開應用

onLaunch 初始化完成時觸發(fā)(觸發(fā)一次)

onShow 用戶進入應用觸發(fā)一次

onHide 用戶引開觸發(fā)

分頁注冊 pages


當分頁初始化打開新頁面時執(zhí)行,執(zhí)行一次

?? ??? ??? ?noe頁面進行跳轉到tow頁面并且攜帶參數(shù)

?? ??? ??? ?tow獲取路由參數(shù)

獲取路由參數(shù)

onLoad(val) {

console.log(val)//{name: "Msea"}

}

onShow路由記錄

分頁進入觸發(fā)

執(zhí)行多次

onReady 分頁初始化完成 執(zhí)行,執(zhí)行一次

onHide

分頁離開執(zhí)行,執(zhí)行一次

onResize 監(jiān)聽小程序橫屏

開啟真機調試(寫入appid)

關閉手機縱向鎖定

配置 pages.json

"globalStyle": {

"pageOrientation":"auto"http://表示允許橫屏

}

onPullDownRefresh 下拉加載

支持微信小程序,H5

"globalStyle": {

"enablePullDownRefresh":true//開啟下拉

}

調用Api

uni.startPullDownRefresh()//開啟

uni.stopPullDownRefresh()//關閉下拉加載

onReachBottom上拉加載

需要設置上拉加載開關

"style": {

"onReachBottom":true,

"onReachBottomDistance":50//默認值是50

}

onPageScroll監(jiān)聽

pc支持

onPageScroll(value){

console.log(value)//scrollTop:10

}?

onTabItemTap 切換tabBar 觸發(fā)

onTabItemTap:function(e) {

console.log(e);

// e的返回格式為json對象: {"index":0,"text":"首頁","pagePath":"pages/index/index.html"}

},

分享

onShareAppMessage(){

return{

title:"分享測試",

path:"pages/index/index",

imageUrl:"https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/gh_33446d7f7a26_430.jpg",

desc:"快來領福利",

success:(res)=>{

console.log(res)

}

}

}

組件注冊


easycom,讓組件注冊更簡單

創(chuàng)建 components文件夾 固定寫法

創(chuàng)建組件 components/test/test.vue 名字必須一致

按照以上規(guī)則直接引用

支持 slot

組件生命周期

更Vue生命周期一致,mounted 渲染完畢,發(fā)送接口

路由跳轉


路由跳轉url寫法

../one/one或者推薦/pages/index/index

tabBar跳轉,不能使用navigateTo,用 uni.switchTab

因為 tabBar跳轉,不是打開新頁

navigateTo 保留老頁面,每次打開新頁面

?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

友情鏈接更多精彩內容