小来宝典之uni-app初学知识点总结(一)
uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、H5、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉/淘宝)、快应用等多个平台。
环境搭建
- 安装APP开发版HBuilderX
- 安装微信开发者工具
- 项目目录介绍以及开发规范简介
项目目录介绍以及开发规范简介
- page文件夹,存放页面的文件夹
- static文件夹,存放静态资源的文件夹 /图片/字体图标,等
- unpackage>dist 存放最终打包输出的文件
- App.vue 文件 是项目的根组件 是页面的入口文件,可调用应用的生命周期函数
- main.js 文件 是项目的入口文件 ,项目加载首先会加载main.js
- manifest.json 文件 用来配置应用的一些打包的东西
- pages.json 文件 用来设置整个项目的页面的存放路径,以及窗口的外观
- uni.scss 文件 常用的样式变量
开发规范
- 页面文件遵循vue中文件组件 ,后缀为vue
- 组件标签靠近小程序规范 详见官方文档
- 接口能力,靠近微信小程序规范,但需前缀wx替换为uni 详见官方文档
- 数据绑定及事件处理同vue.js规范,同时补充了app及页面的生命周期
- 为兼容多端运行,建议使用flex布局 进行开发
字体图标
- uni-app 支持使用字体图标,使用方式与普通 web 项目相同,需要注意以下几点:
- 支持 base64 格式字体图标。
- 支持网络路径字体图标。
- 网络路径必须加协议头 https。
- 从 http://www.iconfont.cn 上拷贝的代码,默认是没加协议头的。
基础组件
- 视图容器:view,scroll-view,swiper
- 基础内容:icon,text,rich-text,progress
- 表单组件:button,check-box,form,input,textarea,picker,radio,switch
- 导航:navigator
- 媒体组件:audio,camera,image,video
- 地图:map
- 画布:canvas
- webview:web-view
- App nvue 专用组件:list,recycle-list
- 扩展组件:uni-ui
<来客推(www.laiketui.com)是国内知名商城系统及商城网站建设提供商,为企业级商家提供零售商城、B2B2C多用户商城系统、社区团购、微信分销系统、小程序商城、商城系统等多端商城网站建设解决方案>
申明:本网站部分文章和图片来源网络编辑,如有侵权及时沟通删除,来客电商原创文章,转载请注明来源。