iView 发布 3.1.0 版本,支持 TypeScript,支持 Vue CLI 3

自 iView 7.28 发布 3.0 后,今天我们又带来了一个重要的版本 3.1.0(版本代号:INSIDE),这个版本 iView 开始支持 TypeScript,可以算是一个新的里程碑。

如果觉得不错,请不要吝啬你的 Star 哦:

?https://github.com/iview/iview

更新日志

先看一下 3.1.0 版本完整的更新日志:
https://github.com/iview/iview/releases

  • 支持 TypeScript
  • 增加 Vue CLI 3 插件。vue-cli-plugin-iview
  • 文档增加 Nuxt.js 用法。查看
  • 文档更新快速上手章节。查看
  • 新增抽屉组件 Drawer。
  • ColorPicker 新增属性 editable,支持输入色值。
  • Tabs 新增属性 beforeRemove,返回 Promise 可中断关闭。
  • InputNumber 新增属性 active-change,设置为 false 时,只会在失焦时更改数据。
  • Modal 新增属性 z-index
  • Modal 的 ESC 按键,现在只会关闭最顶层的模态框,当点击某个 Modal 区域时,它将置为最顶层。
  • 修复 DatePicker 在某些日期下,面板联动错误的 bug。
  • 修复 DatePicker 无法使用 disabled 属性的 bug。
  • 修复 Select 开启 transfer 属性后,在 3.0.1 版本下有时样式错误的 bug。
  • MenuItem 设置 target="_blank" 时,点击菜单不再高亮当前项。

完善的 TypeScript 支持

目前 iView 所有的组件,都增加了 d.ts 定义:
https://github.com/iview/iview/tree/2.0/ty...

对于喜欢写 TS 的用户来说,这是一项不错的福利。由于 Vue 本身的一些问题,目前 iView 在 tsx 的支持上还有一些问题,我们也会继续探讨支持 tsx 的解决方案,以及一些在 iView 使用 TypeScript 的方法和经验,之后都会第一时间发表在 iView 开发者社区 https://dev.iviewui.com/

新增 Vue CLI 3 插件

要说起带 GUI 的工程构建工具,iView CLI 可要比 Vue CLI 3 早上一年多:)不过二者还是有质的区别的,iView CLI 是一个基于 Electron 编译的客户端软件,通过一个界面来生成工程文件。而 Vue CLI 3 是一整套的工程管理服务了。Vue CLI 3 可以说让开发和维护变的及其简单了,所以 iView 3.0 发布后,官方也没再继续维护 iView CLI。这次我们也开发了支持 Vue CLI 3 的 iView 插件:vue-cli-plugin-iview

iView 文档也对工程构建的引导进行了修改,去掉了 iView CLI,而是推荐使用 Vue CLI 3。当你在使用 Vue CLI 3 管理你的项目时,你可以在插件中搜索 iview,然后安装第一个就可以了:

iView 插件还支持一些简单的配置:

  • 选择全局使用还是按需使用 iView(默认全局);
  • 选择使用的语言(默认是中文);
  • 选择是否需要自定义主题(默认为否)。

完成不同的选择后,生成的配置文件也不同。

如果有机会,下一个项目,不妨试试用 Vue CLI 3 来管理吧,你绝对会爱上它!

新增抽屉组件 Drawer

众所周知,iView 官方提供的组件数量是同类开源产品里最多的了,3.0 我们增加了 5 个全新的组件,这个版本,又增加了一个社区呼声较高的抽屉组件 Drawer

坦说的讲,抽屉组件和模态框 Modal 组件是很像的(包括代码也一样),只不过抽屉组件是从侧边打开的,并占满全屏:

对象编辑 - 用于承载编辑相关操作,需要点击关闭按钮关闭

本次更新,也对 Modal 进行了加强。3.0 开始,Modal 组件开始支持拖拽,这意味着同时可以显示多个 Modal,那层级就会是个问题。3.1.0 版本彻底解决了这个问题,如果你同时打开了多个 Modal(一般场景是打开了多个可拖拽的 Modal),现在是有层级关系的,新打开的,或者点击某个 Modal 的可视区域,它都将置为最顶层,而且按 ESC 键,只会关闭最顶层的一个 Modal,不会全部关闭了。而且新增加的 z-index 的属性,可以自定义 Modal 初始的层级值了。

如果你还没更新到 3.x,别等了,赶快更新吧,以后还有好多好东西等着你呢!

特别鸣谢

特别感谢 @yangdan8@lcx960324 在该版本对 iView 支持 TypeScript 的贡献!

本作品采用《CC 协议》,转载必须注明作者和本文链接
本帖由系统于 4年前 自动加精
Aresn
《L01 基础入门》
我们将带你从零开发一个项目并部署到线上,本课程教授 Web 开发中专业、实用的技能,如 Git 工作流、Laravel Mix 前端工作流等。
《G01 Go 实战入门》
从零开始带你一步步开发一个 Go 博客项目,让你在最短的时间内学会使用 Go 进行编码。项目结构很大程度上参考了 Laravel。
讨论数量: 2
Destiny

logo 是 inside 地狱边境的升级版,特别好玩。

6年前 评论

太厉害了

6年前 评论

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!