初识uni-app

作者: w_wx_x | 来源:发表于2018-12-26 15:51 被阅读11次

初识uni-app
初识uni-app
又来霍霍uni-app了,初识uni-app
Uni-App学习路线
uni-app 介绍
uni-app入门详解
uni-app开发踩坑集合(会持续更新)
uni-app 之登录页面
打包桌面应用程序exe 的相关方案
uniapp中小程序状态栏与自定义导航栏

官方文档：https://uniapp.dcloud.io/README

什么是uni-app

使用 Vue.js 开发 跨平台 应用的前端框架
编写一套代码，可编译到多个平台【iOS，安卓，小程序（微信，支付宝，百度），H5】

快速上手

方式一：通过 HBuilderX 创建项目（https://uniapp.dcloud.io/quickstart?id=%E5%88%9B%E5%BB%BA%E9%A1%B9%E7%9B%AE）
方式二：通过 vue-cli 命令行创建项目（https://uniapp.dcloud.io/quickstart?id=%E9%80%9A%E8%BF%87vue-cli%E5%91%BD%E4%BB%A4%E8%A1%8C）
注：cli脚手架仅支持编译为H5网站、支付宝小程序、百度小程序，若需要运行到微信小程序或APP，则将根目录下的src文件夹拖至HBuilderX中，点击 '运行' 菜单执行

开发规范

页面文件 遵循Vue单文件组件规范（https://vue-loader.vuejs.org/zh/spec.html#%E7%AE%80%E4%BB%8B）
组件标签 靠近微信小程序规范（不能使用标准的HTML标签，也不能用js对dom进行操作）（https://uniapp.dcloud.io/component/README）
接口能力 靠近微信小程序规范，需要将wx前缀改为uni（https://uniapp.dcloud.io/api/README）
数据绑定、事件处理 靠近Vue.js规范，同时补充了App及页面声明周期
建议使用 flex 布局，兼容多端
样式：upx尺寸单位，设计师采用iphone6(375px)作为设计稿，uni-app规定屏幕基准宽度750upx
注：动态绑定style不支持直接使用upx,使用uni.upx2px(Number)进行转换
https://uniapp.dcloud.io/frame?id=%E9%A1%B5%E9%9D%A2%E6%A0%B7%E5%BC%8F%E4%B8%8E%E5%B8%83%E5%B1%80