uni-app

vue语法

uni-app的生命周期

Vue的生命周期

创建

beforeCreate

created

可以使用this，没有dom

作用：

• 初始数据
• 注册监听事件
• 开启定时器
• ajax请求

挂载

beforeMount

mounted

可以操作dom

作用：

• 操作dom
• ajax请求

更新

beforeUpdate

updated

卸载

beforeDestory

作用：

• 移除事件监听
• 移除停止定时器

destory

运行环境

目录结构

┌─components		uni-app组件目录
│  └─comp-a.vue	可复用的a组件
├─hybrid		存放本地网页的目录
├─platforms		存放各平台专用页面的目录
├─pages		业务页面文件存放的目录
│  ├─index
│  │  └─index.vue	index页面
│  └─list
│     └─list.vue		list页面
├─static 		存放应用引用静态资源（如图片、视频等）的目录
├─wxcomponents	存放小程序组件的目录，详见
├─main.js               	Vue初始化入口文件
├─App.vue             	应用配置，用来配置App全局样式以及监听 应用生命周期
├─manifest.json    	 配置应用名称、appid、logo、版本等打包信息，详见
└─pages.json           	配置页面路由、导航条、选项卡等页面类信息，详见

全局配置

"globalStyle": {
	"pageOrientation": "portrait",
	"navigationBarTextStyle": "white",
	"navigationBarTitleText": "Hello uniapp",
	"navigationBarBackgroundColor": "#007AFF",
	"backgroundColor": "#F8F8F8",
	"backgroundColorTop": "#F4F5F6",
	"backgroundColorBottom": "#F4F5F6",
	"mp-360": {
		"navigationStyle": "custom"
	}
},

导航栏隐藏
titleView:false
状态栏高度
var(--status-bar-height)

条件编译

条件编译是用特殊的注释作为标记，在编译时根据这些特殊的注释，将注释里面的代码编译到不同平台。

写法：以 #ifdef 或 #ifndef 加 %PLATFORM% 开头，以 #endif 结尾。

ifdef：if defined 仅在某平台存在

ifndef：if not defined 除了某平台均存在

%PLATFORM%：平台名称

条件编译写法	说明
#ifdef APP-PLUS
需条件编译的代码
#endif

仅出现在 App 平台下的代码
#ifndef H5
需条件编译的代码
#endif

除了 H5 平台，其它平台均存在的代码
#ifdef H5 || MP-WEIXIN
需条件编译的代码
#endif

在 H5 平台或微信小程序平台存在的代码（这里只有||，不可能出现&&，因为没有交集）