前言

uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架,开发者编写一套代码,可编译到iOS、Android、H5、小程序等多个平台。uni-app 继承自 Vue.js,提供了完整的 Vue.js 开发体验。uni-app 组件规范和扩展api与微信小程序基本相同。有一定 Vue.js 和微信小程序开发经验的开发者可快速上手 uni-app ,开发出兼容多端的应用。uni-app实现了一套代码,同时运行到多个平台;一套代码,同时运行到iOS模拟器、Android模拟器、H5、微信开发者工具、支付宝小程序Studio、百度开发者工具、字节跳动开发者工具、QQ开发者工具(底部8个终端选项卡代表8个终端模拟器)。

为什么要选择uni-app

1.开发者/案例数量更:几十万应用、uni统计月活12亿、70+微信/qq群、更高的百度指数,跨端完善度更高,真正落地的提高生产力。

2.平台能力不受限:在跨端的同时,通过条件编译+平台特有API调用,可以优雅的为某平台写个性化代码,调用专有能力而不影响其他平台。支持原生代码混写和原生sdk集成。

3.性能体验优秀:加载新页面速度更快、自动diff更新数据。App端支持原生渲染,可支撑更流畅的用户体验。小程序端的性能优于市场其他框架。

4.周边生态丰富:插件市场数千款插件。支持NPM、支持小程序组件和SDK。微信生态的各种sdk可直接用于跨平台App。

5.学习成本低:基于通用的前端技术栈,采用vue语法+微信小程序api,无额外学习成本。

6.开发成本低:不止开发成本,招聘、管理、测试各方面成本都大幅下降。HBuilderX是高效开发神器,熟练掌握后研发效率至少翻倍(即便只开发一个平台)。

uni-app开发环境配置

  • uni-app官网地址:uni-app
  • HBuilderx下载地址:HBuilderx

  • 文件 > 新建 > 项目 > uniapp, 并设置项目保存路径。

  • 打开项目 demo > unpackage > manifest.json > 基础配置,设置uni-app 应用程序标识。
    这里需要先注册登录后才可以点击云端获取(app-id)。

  • 点击,运行 > 运行到手机或模拟器 > 设备xxxxx ,查看控制台和手机端,如果出现 index.vue中的返回内容,则表示运行成功。

  • 运行到手机模拟器显示效果

uni-appの发展和应用相关推荐

  1. 切换 uniapp_万能前端框架uni app初探03:底部导航开发

    前言 本节我们使用uni app的底部导航功能,点击不同tab会显示不同页面,这个功能在实际项目开发中几乎是必备的. 一.基础知识 1.tabBar 如果应用是一个多 tab 应用,可以通过 tabB ...

  2. uni app map 地图 漂浮问题及方案

    uni app map 地图 漂浮问题及方案 文章页有图片导致的问题,图片没加载出来,导致文章内容高度不固定,如果图片没加载出来,高度就是0,如果此时开始加载map,那么map就在那里加载,map原生 ...

  3. uni.app H5(微信公众号定位) uni.getLocation

    最近在开发公众号,由于之前经常使用uni,app写APP,索性就用uni.app来开发公众号了, 不过也遇到了一个问题,就是在公众号的首页要获取用户的定位.我看了看官网的API 有个uni.getLo ...

  4. HBuilder X ——Uni app 学习笔记(一)

    HBuilder X --Uni app 学习笔记(一) 1.pages.json配置 *pages数组中第一项表示应用启动页,数组中其他项为项目中所有页面路径. enablePullDownRefr ...

  5. uni app中使用图表

    关于在uni app中运用图表 今天写项目,需要在uni app中使用图表,我使用的是ucharts. 具体操作如下 1.下载 ucharts可以直接在uni app的插件市场下载安装. 先在插件市场 ...

  6. uni app 自动化索引列表

    uni app 自动化索引列表,官方推荐的第三方插件 https://ext.dcloud.net.cn/plugin?id=375 [{"letter": "A&quo ...

  7. HbuilderX:uni app踩坑之uView-ui

    HbuilderX:uni app踩坑之uView-ui 最近在自学uniapp,想找一个ui框架提高一下学习和开发的效率,于是就网上冲浪,浪来浪去,最后选择了uView-ui这款.其实有些框架我是有 ...

  8. uni App+H5 实现人脸识别

    uni App+H5 实现人脸识别 通过h5的视频video管理设备摄像头(不要关),在打开视频摄像时快照截取人脸照片传送到后台通过API接口调用百度人脸识别结果并通过返回数据解析自己业务需求. 1. ...

  9. uni app 视频播放功能

    视频播放功能,需求:编译成纯h5网页,运行在任意容器里,如浏览器.安卓原生和iOS等 媒体组件video 首先使用video组件,然后高度需要自己设置 uni.createVideoContext 官 ...

  10. uni app(H5)中软键盘弹出,固定定位绝对定位元素位置发生错乱

    一.问题如下 最近用uni app写项目,发现H5软键盘弹起,导致我固定定位的按钮被顶了上去,如图 二.解决方法 1.让其在输入框获取焦点时隐藏 百度了许多,有让输入框获取焦点时让按钮隐藏的方法,失去 ...

最新文章

  1. 【pytorch】nn.conv1d的使用
  2. 如何将CSS应用于iframe?
  3. Win7下Event_Log服务4201错误的有效解决方法
  4. tkinter学习-菜单与画布
  5. Python的安装 || python介绍
  6. spring bean的作用域和生命周期
  7. 为了保护眼睛,请调节颜色
  8. Java持久性锁定初学者指南
  9. libsvm java下载_一个基于LIBSVM(JAVA)的股票预测demo
  10. 雪花开发者中心地府云自适应1号模板 雪花xueidc插件
  11. php simplexmlelement array,php中SimpleXMLElement 对象转换为数组
  12. kylin操作系统是什么
  13. 比尔·盖茨退出微软董事会,回顾盖茨与微软的传奇故事
  14. Codeforce 1600Difficulty Graphs 20 questions
  15. WIN7 SP1系统浏览器怎么离线升级到IE11,怎么解决?
  16. 皮尔逊相关系数(Pearson Correlation Coefficient)
  17. MAC 谷歌浏览器提示您的连接不是私密连接,没有继续访问选项
  18. 入魂一番赏android,入魂一番赏APP
  19. 项目中遇到的问题(一)弹出UIAlertController 时出现 Warning: Attempt to present * on * which is already presenting
  20. 缠中说禅108课》87:逗庄家玩的一些杂史 4

热门文章

  1. 相亲交友v6.7.7
  2. 基于simulink的风力机房温度控制系统仿真
  3. 思维导图(自我介绍)
  4. NYOJ 无主之地1
  5. 伤害世界不显示服务器,伤害世界Hurt world服务器挑选指南 不卡不清档无权限服务器挑选教程...
  6. c语言strcpy、strcmp、strcat等常见字符操作函数的介绍
  7. JAVAWEB开发之SpringMVC详解(二)——高级开发、数据回显、参数绑定集合、图片上传、json交互、validation校验、异常处理、RESTful支持、拦截器
  8. 阻塞(blockage)设置优化——Hard,Soft,Partial
  9. 服务器规范名字与IP地址的转换
  10. 在linux安装pyrit