uniapp组成(生命周期)

应用注册 App

获取用户进入或者离开应用

onLaunch 初始化完成时触发（触发一次）

onShow 用户进入应用触发一次

onHide 用户引开触发

分页注册 pages

当分页初始化打开新页面时执行,执行一次

            noe页面进行跳转到tow页面并且携带参数

            tow获取路由参数

获取路由参数

onLoad(val) {

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

}

onShow路由记录

分页进入触发

执行多次

onReady 分页初始化完成 执行,执行一次

onHide

分页离开执行,执行一次

onResize 监听小程序横屏

开启真机调试(写入appid)

关闭手机纵向锁定

配置 pages.json

"globalStyle": {

"pageOrientation":"auto"//表示允许横屏

}

onPullDownRefresh 下拉加载

支持微信小程序,H5

"globalStyle": {

"enablePullDownRefresh":true//开启下拉

}

调用Api

uni.startPullDownRefresh()//开启

uni.stopPullDownRefresh()//关闭下拉加载

onReachBottom上拉加载

需要设置上拉加载开关

"style": {

"onReachBottom":true,

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

}

onPageScroll监听

pc支持

onPageScroll(value){

console.log(value)//scrollTop:10

} 

onTabItemTap 切换tabBar 触发

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,让组件注册更简单

创建 components文件夹 固定写法

创建组件 components/test/test.vue 名字必须一致

按照以上规则直接引用

支持 slot

组件生命周期

更Vue生命周期一致,mounted 渲染完毕,发送接口

路由跳转

路由跳转url写法

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

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

因为 tabBar跳转,不是打开新页

navigateTo 保留老页面,每次打开新页面