# uniapp是什么
uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、H5、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉/淘宝)、快应用等多个平台。
优点:
- 学习成本低
- 开发成本低
- 按需编译(通过注释写法可保留平台特点,又不增加其他平台发布资源包大小)
# 目录结构
- unpackage 启动自动生成目录,会自动生成多版本代码
- pages.json 通用部分配置项,页面路由,导航条,选项卡等页
- manifest.json 项目常用配置
- main.js 入口文件
- App.js 应用配置,用来配置App全局样式以及监听应用的声明周期
- static 静态资源
- pages 业务页面存放目录
- uni.scss 全局通用scss样式库
# 生命周期
uniapp生命周期分为3种:
- 应用生命周期(只能在App.vue中监听)
- 页面生命周期
- 组件生命周期(同vue基本一致)
# DOM操作
# uni全局对象
uni提供了一个全局uni对象来充当eventBus,可以事件订阅
# 运行
调试微信小程序首先要开启服务端口,步骤:设置 -> 安全设置
- 编写后的程序想在浏览器或者小程序模拟器上,可以点击在顶部的
运行
,小程序模拟器可以通过点击运行到小程序模拟器
,再点击运行设置
来对工具路径进行设置 - 运行后会在原项目目录下生成
unpackage
文件夹,目录结构:unpackage>dist>dev>
,dev下面会包含你模拟的对应的小程序的目录 - 运行模拟器后,源文件修改会有
hot reload
效果
# 其他
# 授权
如果授权的话,必须设置AppID
- uni.authorize(OBJECT) 提前向用户发起授权请求。调用后会立刻弹窗询问用户是否同意授权小程序使用某项功能或获取用户的某些数据,但不会实际调用对应接口。如果用户之前已经同意授权,则不会出现弹窗,直接返回成功。如果用户之前拒绝了授权,此接口会直接进入失败回调,一般搭配uni.getSetting和uni.openSetting使用。