uniapp基础

　　uni-app 是一款基于 vue 的支持多端开发的一套开源的架构

创建 && 运行发布

　　除了运用 HBuilderX 之外，还可以使用 vue-cli 进行创建项目，但是 vue-cli 必须是 3.x 的版本

　　　　npm instiall -g @vue/cli      // 安装 vue-cli 最新的版本

　　　　vue creat -p dcloudio/uni-preset-vue my-project

　　　　npm run dev:mp-weixin   // dev 环境运行项目

　　　　npm run build:mp-weixin  // 打包项目

 

 

生命周期

　　应用生命周期

　　　　onLaunch：当 uni-app 初始化完成时触发（全局只触发一次）；

　　　　onShow：当 uni-app 启动，或者从后天进入前台显示；

　　　　onHide：当 uni-app 从前台进入后台；

　　　　onUniNViewMessage：对 nuve 页面发送的数据进行监听；

　　

　　页面生命周期

　　　　onLoad：监听页面加载，其参数为上个页面传递的数据，参数类型为 Object；

　　　　onShow：监听页面显示；页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面；

　　　　onReady：监听页面初次渲染完成。注意如果渲染速度快，会在页面进入动画完成前触发；

　　　　onHide：监听页面隐藏；

　　　　onUnload：监听页面卸载；

　　　　onResize：监听窗口尺寸变化；

　　　　onPullDownRefresh：监听用户下拉动作，一般用于下拉刷新；

　　　　onReachBottom：页面上拉触底事件的处理函数；

 

　　　　onTabltemTap：点击 tab 时触发，参数为 Object；

　　　　　　onTabItemTap 常用于点击当前 tabItem，滚动或者刷新当前页面；如果是点击不同的 tabitem，一定会触发页面切换；

　　　　　　如果想要在 App 端实现点击某个 tabItem 不跳转页面，不能使用 onTabItemTap，可以使用 plus.nativeObj.view 放一个区块盖住原先的 tabItem，并拦截点击事件；

　　　　　　参数说明：index：string 类型，被点击 tableItem 的序号，从 0 开始；

　　　　　　　　　　　pagePath：string 类型，被点击 tableItem 的页面路径；

　　　　　　　　　　　text：string 类型，被点击 tableItem 的按钮文字；

 

　　　　onShareAppMessage：用户点击右上角分享；

 

　　　　onPageScroll：监听页面滚动，参数为 Object；

　　　　　　参数说明：scrollTop：number类型，页面在垂直方向已滚动的距离（单位px）;

 

　　　　onNavigationBarButtonTap：监听原生标题栏按钮事件，参数为 Object；

　　　　　　参数说明：index：string 类型，原生标题栏按钮数组的下标；

 

　　　　onBackPress：监听页面返回，返回 event = { from: backButton、navigateBack}，backButton 表示来源是左上角返回按钮或者 android 返回键；navigateBack 表示来源是 uni.navigateBack；

　　　　　　参数说明：from：string 类型，触发返回行为的来源：“backButton” -- 左上角导航栏按钮以及安卓返回键；“navigateBack” -- uni.navigateBack() 方法； 

 

　　　　onNavigationBarSearchInputChanged：监听原生标题栏搜索输入框输入内容变化事件；

　　　　onNavigationBarSearchInputConfirmed：监听原生标题输入框搜索事件，用户点击软键盘上的 “搜索” 按钮时触发；

　　　　onNavigationBarSearchInputClicked：监听原生标题栏搜索输入框点击事件；