|
uni-app?是一个使用?Vue.js?开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、H5、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉）等多个平台。
引用官方介绍,为什么它可以做到这点 ??uniapp?内置了?Vue.js?如果你熟悉?Vue.js?,?就知道?Vue?的核心只是完成的只是在数据变更后,自动帮你把用到这个数据的 " 对象 " 中的数据进行更新,在浏览器器上它对应着浏览器?dom?,在不同的平台上它可以对应不同的东西,这就赋予了?Vue.js?的跨平台能力
刚刚说的"对象"并不是?Javascript?中 的?Object?,理解成 面向对象编程中的对象更为合适,无论它是虚拟的还是现实中的东西,它都可以被描述为对象 . 你可以想象吗,有人已经把?Vue?移植到了带有显示屏的底层硬件上,每当?Vue?代码中的数据更新时,显示屏上的数据也会被通知更新 .
你知道这点就行了 :?uniapp?编译时,把?Vue?template中的基础组件对应不同平台上的基础组件,完成了跨平台的工作 .
uniapp?跨平台是不是很多坑?
你一定会怀疑?unipp?的能力 . 是的,必然是有坑的 . 但是坑的层面不是数据层面,?Javascript引擎在不同平台上的解析都是符合规范的 ?,一般是?css?样式 或者?api?层面的,每个平台对?css和api?的支持不同,这个必须你自己去做兼容,再好的编译也不可能完全消除原生上带来的差距 . 因此,它的坑并不是因为自身的原因,而是你对这个平台本身不是很了解,写出了不兼容的代码 .
如果你不考虑兼容的话,我可以说它写小程序是没有坑的 . 你最后写起来会感觉跟小程序差不多,但是写起来更爽 .
为什么我一定推荐你用?uniapp?写微信小程序?
微信小程序用它的语法写不好吗 ? 为什么一定要用?uniapp?呢 . uniapp有几大优势
- 微信的所有api都可以用
Vue?的几乎所有语法的支持- 内置?
Vuex?和?Vue-router
- 可以用浏览器调试
其他类似于css动画,vue单文件的优势就不一一说了 .? 加粗的每一点都值得你去使用?uniapp?.
第一点:用?Vue?来写程序,你的?Vue?水平和了解程度也会上升不少,将来写网页或者其他东西时候,用?Vue?也是胸有成竹 .
第二点: 微信小程序没有内置 类似?Vuex?的功能,导致跨页面,跨多级组件的共享数据会非常麻烦 .
第三点: 如果你调试过微信小程序就知道,每次修改完后编译是多慢,展开?dom?是多么麻烦,查看数据只能一个?console.log?或者?debugger?来调试 . 但是用 chrome来调试就完全不同了,它编译很快,可以用?Vue?官方插件?dev-tool?来 查看?v-node?树,数据状态和?Vuex?,这个真的是在开发体验和效率上是**降维打击 . **
版本较新的浏览器对?css?的支持是一个超集,在小程序中的能使用的样式在?chrome?完全兼容,调试效率也会高一些,不过自定义组件要注意一下,它的宽高只能由内部撑起 .
uniapp?来写小程序有没有缺点呢?
有 .
- 微信限制小程序包的大小为?
2mb?,但是?uniapp?编译的小程序因为自带?Vue?Vuex?等原因,会稍稍多几十kb
不过不是特别大的问题 . 2. 首次渲染页面速度不如小程序 . 毕竟是要多一层?Vue?的传递所以,首次加载不如原生 .
但是后续的数值更新,特别是大量数据的更新,因为?Vue?中有?diff?算法使渲染的效率大大提升 .
开启?uniapp?的学习
第一步:首先下载安装?hbuiderx(标准版)?和?微信开发者工具
第二步:?hbuilderx?安装完后
安装?uniapp?插件,其他的插件 比如?scss?编译 等等也可以安装一下,全装也没问题哈
第三步:微信开发者工具和?uniapp?都安装完后打开微信开发者工具,登录账号等等操作
设置服务端口,先打开你的微信开发者工具 -> 上栏 -> 设置 -> 安全设置 -> 服务端口 -> 开启
接着 hbuilderx导航栏 工具 -> 设置 -> 源码视图 这里可以看到右边有设置的json 找到最后一行->?"weApp.devTools.path":""?这里填上微信开发者工具的绝对路径 比如我的 :?"weApp.devTools.path":"E:/微信web开发者工具"
第四步:两个都设置完后,249); border: 0px; font-weight: 600; font-size: 14px;'>hbuilderx?导航栏左上角:文件 -> 新建 -> 项目 -> 选择?uniapp?->选择模板 : Hello?uniapp?演示模板 创建-> 导航栏中间:运行 -> 运行到小程序,你就可以啦~
接下来的学习可以到官方的文档去学习哦~
官方的文档 （编辑：李大同）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!
|
