uni-app 1.2发布,iOS、Android、小程序、H5主流四端全覆盖

uni-app 1.2发布,iOS、Android、小程序、H5主流四端全覆盖
最新回答
森屿微央

2024-02-18 17:28:37

uni-app 1.2版本正式发布,实现iOS、Android、小程序、H5主流四端全覆盖

uni-app自发布以来,凭借其遵循Vue.js语法规范、一套代码多端发行的特性,迅速赢得了上万名开发人员的青睐,目前已累计创建了数万个应用。为了满足更多开发者的需求,uni-app团队历时一个多月精心打磨,正式推出了1.2版本,该版本实现了对H5平台的支持,至此,uni-app已经全面覆盖了iOS、Android、小程序、H5这四大主流平台。

多端体验

为了直观展示uni-app在四大平台的表现,开发者可以依次扫描以下二维码进行对比体验:

  • iOS平台:
    点击此处查看二维码链接
    (注:由于Appstore不能提交简单demo,所以iOS版补充了一些其他功能。)

快速上手

uni-app支持通过HBuilderX可视化界面和vue-cli命令行两种方式快速创建项目,并运行到H5平台。

  • 通过HBuilderX可视化界面

    下载并安装HBuilderX。

    新建项目,选择uni-app类型,并选择Hello uni-app模板。

    点击顶部菜单,运行到chrome浏览器。

    HBuilderX开始编译,并将信息输出到控制台。

    编译完成后,HBuilderX会自动打开chrome浏览器并加载H5页面。

    tips

    若chrome已提前打开,则需开发者手动将chrome切换为手机调试模式。

    若chrome未打开,HBuilderX会尝试自动将chrome切换为调试模式,但这个切换存在延时,若页面显示不正常,需手动刷新。

  • 通过vue-cli命令行

    全局安装vue-cli:npm install -g @vue/cli。

    创建uni-app项目:vue create -p dcloudio/uni-preset-vue my-project。此时,会提示选择项目模板,初次体验建议选择hello uni-app项目模板。

    进入目录并运行:cd my-project 和 npm run serve。运行成功后,控制台会输出H5网站访问地址。

    启动chrome浏览器并切换为手机调试模式,访问如上地址即可体验。

    tips

    目前cli脚手架仅支持编译为H5网站,下版本将支持编译到微信小程序平台。

    现阶段若需运行到微信小程序或App,则需将项目根目录下的src文件夹,拖拽到HBuilderX中,点击“运行”菜单执行。

H5端配置

uni-app在发行到H5端时,采用的是SPA模式,支持以下配置:

  • 自定义页面模板,支持简单的SEO配置及百度统计。
  • 支持hash/history两种路由跳转模式。
  • 支持自定义页面js加载组件。

本次发版的其它更新

uni-app 1.2版本还包括以下更新内容:

  • 新增条件编译#ifndef,代表非此平台的条件编译(如代表非H5平台,即uni-app目前支持的App及小程序平台)。
  • 新增API tabBar支持设置红点和角标。
  • 新增API监听网络状态变化。
  • 新增button组件的open-type属性支持feedback值域。
  • 新增manifest.json配置navigateToMiniProgramAppIdList节点,可配置需跳转的小程序列表。
  • 新增nvue支持第三方weex ui库。
  • 新增nvue支持bindingx。
  • 新增nvue支持顶部原生导航的onNavigationBarButtonTap事件。
  • 修复了uni.request method为PUT、DELETE时,参数信息丢失的问题。
  • 修复了picker组件cancel事件不触发的问题。
  • 修复了复杂场景下组件数据渲染异常的问题。
  • 修复了uni.canvasToTempFilePath方法设置参数destWidth、destHeight不生效的问题。
  • 修复了nvue初始化时得不到storage的问题。
  • 修复了nvue Android平台不支持Websocket功能的问题。
  • 修复了nvue Android平台页面未设置titleNView时可能显示不正常的问题。
  • 修复了nvue iOS平台弹出软键盘后收回区域可能不对的问题。
  • 修复了nvue iOS平台使用uni.request不能设置data的问题。
  • 优化了web-view组件,增加了网页加载进度条,优化了标题与页面title的同步。
  • 优化了input组件type="number"在App端支持输入小数点。

未来计划

uni-app将继续保持高速迭代,在继续完善已覆盖的四端情况下,补充百度、支付宝小程序的兼容。更多需求计划,请参考uni-app需求墙。

uni-app 1.2版本的发布,标志着其在多端开发领域又迈出了坚实的一步,为开发者提供了更加便捷、高效的多端开发解决方案。