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 保留老頁面,每次打開新頁面