什么是uniapp
UniApp是一款开发跨平台App和小程序的前端框架，是由DCloud公司推出的一款全新的开发工具。UniApp使用Vue.js作为开发语言，同时基于微信小程序、H5、App、支付宝小程序和百度小程序，可以一次编写，多平台运行。在这3000字的学习过程中，我将分享从入门到实战的UniApp学习经验。
uni，读 you ni，译音为“优你”，是统一的意思。很多人以为小程序是微信先推出的，其实，DCloud才是这个行业的开创者。DCloud于2012年开始研发小程序技术，优化 webview 的功能和性能，并加入W3C和 HTML 5中国产业联盟，推出了HBuilder开发工具，为后续产业化做准备。
2015年, DCloud 正式商用了自己的小程序,产品名为“流应用”,它不是BS模式的轻应用，而是能接近原生功能、性能的动态App，并且即点即用。为将该技术发扬光大，DCloud将技术标准捐献给工信部旗下的HTML 5中国产业联盟，并推进各家流量巨头接入该标准，开展小程序业务。360手机助手率先接入，在其3.4版本实现应用的秒开运行。
uni-app是一个使用vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、H5 以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉/淘宝等)、快应用等多个平台。
随后DCloud推动大众点评、携程、京东、有道词典、唯品会等众多开发者为流应用平台提供应用。
在2015年9月，DCloud推进微信团队开展小程序业务，演示了流应用的秒开应用、扫码获取应用、分享链接获取应用等众多场景案例，以及分享了webview体验优化的经验。
微信团队经过分析，于2016年初决定上线小程序业务，但其没有接入联盟标准，而是制定了自己的标准。
DCloud持续在业内普及小程序理念，推进各大流量巨头，包括手机厂商，陆续上线类似小程序/快应用等业务。
部分公司接入了联盟标准，但更多公司因利益纷争严重，标准难以统一。
技术是纯粹的，不应该因为商业利益而分裂。开发者面对如此多的私有标准不是一件好的事情。
造成混乱的局面非 DCloud所愿，于是决定开发一个免费开源的框架。
既然各巨头无法在标准上达成一致，那么就通过这个框架为开发者抹平各平台的差异。
选择uni-app的原因：
1、开发者/案例数量更多
2、跨平台能力及扩展灵活性更强
3、性能体验优秀
4、周边生态丰富
5、学习成本低
6、开发成本低
下载HBuilderX
HBuilderX官网下载地址：HBuilderX-高效极客技巧
选择对应的版本下载即可：
图 HBuilderX下载窗口
选择正式版，可以下载Windows版和Mac OS版，其各有两个版本，分别是标准版和APP开发版。其中，标准版可直接用于Web开发、MarkDown、字处理场景、小程序等。如果开发App.则需要手动安装插件。App开发版预置开发App所需的插件，开箱即用。如果只是开发小程序和H5，则安装标准版即可。这里下载的是App开发版。
HBuilder X下载完成后即可安装，Windows版和Mac OS版的安装都很简单，按提示操作即可，这里不做演示。
通过HBuilderX可视化界面创建第一个uni-app应用
第一步：打开HBuilderX，点击工具栏里的文件 -> 新建 -> 项目
第二步：选择uni-app类型，输入工程名，选择模板，点击创建，即可成功创建
最后：项目创建完成之后即可运行，打开项目的任意文件，如App.vue，选择“运行”-->"运行到浏览器“命令，选择浏览器，即可在浏览器中体验uni-app的H5版。
pages.json文件主要用于对uni-app进行全局配置，可以在配置项设置默认页面的窗口、设置页面路径及窗口、设置组件自动引入规则、设置底部tab及分包加载配置等。
pages.json文件配置的参考文档地址
pages.json 页面路由 | uni-app官网
manifest.json文件可以配置H5、小程序、App信息，如配置代理，H5模板以及小程序AppID、App的名称、图标、权限等。
manifest.json文件配置的参考文档地址
App Android@android | uni-app官网
uni.request发起网络请求相当于之前vue里面的axios用于获取服务器端接口数据。
文档地址：uni.request(OBJECT) | uni-app官网
使用uni.request发起接口数据请求的实际案例：
描述：接口文档提供了一个get请求的接口，需要把接口的分类数据请求回来并渲染到页面当中。
扫一扫
142
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
