金秋十月，iView 4.0 如约而至。但是标题信息量有点大，所以先来解读一下标题。
iView 作者 Aresn 于 2019 年创办了北京视图更新科技有限公司，开始自由、全职地维护 iView 及其相关的软件。View UI 即为原先的 iView，从 2019 年 10 月起正式更名为 View UI，并使用全新的 Logo。iView 作者将在新仓库 https://github.com/view-design/ViewUI 继续开发 iView 4.0 和后续版本，以及维护工作。原仓库 iView 作者不再继续提交内容。
简单说就是，我们将 GitHub 迁移到了：
https://github.com/view-design/ViewUI
对于绝大部分用户来说，使用没有任何影响，之后的 issue 和 pr 也请大家到新的仓库进行提交，当然包括 Star ！
请相信，全新的 View UI 组件库会带来更强大的功能和更出色的体验。由于现在已经全职维护，这里也可以向大家保证，每 1~2 周迭代一个版本。
4.0 版本的核心是功能增强和体验优化，基本没有不兼容的，大家可以放心升级，主要的更新内容下文会逐一介绍。
更新方法很简单，修改 package.json 中 iview 的版本号为 4.0.0：
"dependencies": {
"iview": "^4.0.0"
}
然后运行 npm update iview 即可。
同时，我们也提供了一个新的 npm 包 view-design，如果你是初次使用 View UI，也可以这样安装：
npm install view-design --save
或
npm install iview@4.0.0 --save
本次的 4.0 版本有超过 50 项更新。
UI 方面，主要是将原先的基础字号由 12px 调整为了 14px。现在的电脑屏幕越来越大，分辨率也越来越高，14px 的基础字号会更加实用，而且也是大势所趋。
对应的，很多组件的尺寸会稍微变大，比如所有的 Form 系列组件（ Button、Select、Input 等等）的尺寸调整为了 40px （ large ）、32px （ default ）、24px （ small ）。
Button 的高度计算方式由原先的 padding 调整为了固定 height。
还有很多组件的 UI 也进行了微调，比如 Alert、Notice、Modal、Card 等等，整体更统一、规范。
下图是两个版本的尺寸对比：
List 组件是最基础的列表展示，可承载文字、列表、图片、段落，常用于后台数据展示页面。
全局配置中，新增 capture 选项，可以配置所有组件默认的 capture 模式，默认为 true。
capture 是浏览器的一种默认行为，如果开启，当可下拉的组件（例如 Select ）处于展开状态时，点击外部操作不会立即响应，而是先收起下拉菜单，再次点击才会响应操作。 如果不需要该特性，可以通过全局配置，将 capture 设置为 false。
Table 表格组件是大家最关心的，4.0 我们提供了更多新的功能：
1.拖拽表头调整列宽
列 column 新增加了属性 resizable，设置为 true 时，鼠标在表头对应列的分割线上，就可以拖拽来调整列宽了：
2.合并行或列
新增了 span-method 属性，可以自定义合并行或列，也就是可以合并单元格了，通过该属性的配置，是可以对任意的行或列进行合并的：
3.表尾合计
新增了 show-summary 属性，设置为 true 时，会在表尾显示一个合计行，自动对该列数值求和。同时也新增了 summary-method 和 sum-text 来自定义合计的算法或文案：
4.默认样式不带外侧边框
4.0 起 Table 表格组件的外轮廓默认不带边框了，更简洁，除非设置 border 属性。
这几个功能给力吧，更给力的功能我们还会在 4.x 之后的几个版本中更新哦！
1.新增属性 disabled
如果想让 Form 组件内的所有表单组件，例如 Button、Input、Select、Radio、Checkbox 等（ View UI 的所有表单组件都支持）都禁用，以前的做法是要给每一个组件逐个加 disabled，很麻烦，现在只需要给外层的 Form 组件设置 disabled 属性就可以了：
2.新增属性 hide-required-mark
给表单 Form 设置了校验规则中的 required，也就是必填，对应的 FormItem 的 label 前就会有一个红色的星号 *。但是往往一个长表单，都显示必填的 * 看起来是没必要的，所以只需要给 Form 开启 hide-required-mark 属性，就不显示必填的星号了。
3.新增属性 label-colon
开启该属性，在 FormItem 的 label 名称后会自动加冒号：，不用再一个个配置了。
4.新增事件 @on-validate
任一表单项被校验后触发，返回表单项 prop、校验状态、错误消息。
1.新增属性 allow-create 及事件 @on-create
在 filterable 模式下，开启属性 allow-create 可以通过在输入框中输入文字来创建新的条目。输入新条目后，按下回车键即可新建条目。
2.Option 组件新增属性 tag
Option 组件新增属性 tag，设置后，在多选时，标签将优先显示设置的内容。
多选，选中的标签，默认显示的就是 label，而在远程搜索的一些场景中，只有 label 会不够用，所以新增了 tag 这一属性。
1.新增属性 show-word-limit
开启属性 show-word-limit 可以显示字数统计，配合 maxlength 属性来限制输入长度：
2.新增属性 password
在 type="password" 时，开启属性 password 可以切换显示隐藏密码：
新增属性 marks
设置属性 marks 可以显示标记。标记的 key 取值应该在闭合区间 [min, max] 内。标记点也可以通过 style 和 label 自定义样式：
1.开关背景颜色
新增属性 true-color 和 false-color，可以自定义背景色：
2.阻止切换
新增属性 before-change，如果设置，并返回 Promise，可以阻止切换，经常用于切换时请求数据，或二次确认的情况，可以配合 loading 来使用。
1.百分比内显
新增属性 text-inside，开启后，可以将百分比显示在进度条内部：
2.渐变色
属性 stroke-color 设置为数组时，可以显示为渐变色了，该特性 Circle 进度环组件也支持：
带背景色
新增属性 background， 开启后，通知提示会显示背景色：
新增属性 border，支持带边框的样式：
新增属性 disabled，开启后可以禁用分页组件：
其它组件还有很多更新：
color，可以设置更多的状态点颜色及自定义颜色。count，设置时，可以自定义角标显示内容（去角标背景），数值 count 将无效。text，设置时，可以自定义角标显示内容（带角标背景），数值 count 将无效。亦可自定义状态点模式下的 text 内容。to、target、replace、append，支持跳转链接。size，可以设置不同的尺寸，可选值为 large （大号）、medium （中号）、default （默认）title、content 和 icon。这波更新很给力吧！
iView 已经有 3 年多的沉淀，今天更名为 View UI 也是一个全新的开始。我知道市面上对我们商业化有不同的看法，但 View UI 的初衷是永不变的，会永远免费开源，也会永远更新下去，给大家不断带来期望和惊喜。
但是为了更好的服务企业用户，也为了我的公司得以生存，商业化的产品是在所难免的。如果 View UI 对你的公司或团队节省了成本，提高了开发效率，或者想使用更丰富的高阶组件、强大的整套中、后台前端解决方案，欢迎购买我们的专业版产品 View UI Pro 和 Admin Pro。
最后附上专业版地址，可以在线体验：
Admin Pro 介绍： https://pro.iviewui.com/admin-pro
Admin Pro 在线预览： https://adminpro.iviewui.com
View UI Pro： https://pro.iviewui.com/pro
之后，我们还会通过公众号分享更多的内容，欢迎关注：
这是一个专为移动设备优化的页面（即为了让你能够在 Google 搜索结果里秒开这个页面），如果你希望参与 V2EX 社区的讨论，你可以继续到 V2EX 上打开本讨论主题的完整版本。
V2EX 是创意工作者们的社区，是一个分享自己正在做的有趣事物、交流想法，可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.