<>作用
跨端(APP、各种小程序、H5)开发框架,总十个平台
<>特点
1、运用了vue语法
2、小程序的组件模式
3、通过uni-app统一各端api
4、编译出各端的源代码
<>目录结构
1、package.json 页面程序的目录的配置
2、main.js 程序的入口
3、App.js 根组件
4、static 静态资源目录
index/index.vue 首页
5、components 组件存放目录(不需要注册)
6、wxcomponnets 微信专用组件存放目录
<>运行编译环境准备
<>H5
<>App
1、下载app模拟器
2、配置端口
运行-运行到手机或模拟器-Android模拟器端口设置
3、运行
1.打开模拟器
2.运行-运行到手机或模拟器-运行项目xxx到xxx模拟器
<>微信
1、下载并安装微信开发工具
2、微信开发工具-设置-安全设置-服务器端口开启
3、HBuilderX-运行-运行到小程序模拟器-运行设置-小程序开发者工具路径
<>index.vue页面分析
template模板,script业务逻辑,style样式
<>常用组件
1、view 块元素
2、text行内元素
3、navigate 导航
<>条件编译
<>常用条件
#ifdef APP-PLUS APP #ifdef MP-WEIXIN 微信 #ifdef H5 H5网页
<>模板中
<!-- #ifdef APP-PLUS --> <!-- #endif -->
<>样式中
/*#ifdef APP-PLUS */ /* #endif */
<>配置中
<!-- #ifdef APP-PLUS --> <!-- #endif --> 单独配置 “h5”:{} “App-plus”:{}
<>page.json
<>pages 页面配置
path:xxx/xxx 路径
style 样式(glovalStyle 配值一样)
<>globalStyle 全局配置
1、“navigationBarTextStyle”: “black”, 导航文字颜色
2、“navigationBarTitleText”: “uni-app”, 导航标题
3、“navigationBarBackgroundColor”:"#F8F8F8", 导航背景颜色
4、“backgroundColor”: “#F8F8F8” 页面背景颜色
<>内置组件
1、view 块
2、tex 文本
3、selectable 文字长安可选
4、image 图片
5、navigator 导航
6、swioer 幻灯片
7、swiper-item 幻灯片-一页
<>扩展组件
uni.request 网络请求
<>css
height:var(–status-bar-height) 状态栏的高度
技术
今日推荐