Skip to content
Changelog Hub

antd 3.9.0

npm / antd / 3.9.0 source ↗

In September we brought an update for 3.9.0. There are many new features in 3.9.0, Ant Design is getting stronger and solider.

  • 🔥🔥🔥 In the 3.9.0 version, we redraw all the icons, adding two new categories, more than 90 new icons. And the bit adds a variety of styles to each icon. To this end, we have rewritten the Icon component, replaced the fontface icon with SVG, adding a number of features that allow us to quickly use new icons and styles.
    • 💄 Replace the css font icon with the SVG icon, see more disscussion about it.
    • 💄 You can now render a two-color icon.
    • 💄 We provide three theme of icons: outlined, filled, twoTone, default theme is outlined.
    • 🌟 Two new categories, Edit Icons and Data Icons, have been added.
    • 🌟 Add the theme attribute to set the theme style of the icon. #11971
    • 🌟 Added component attribute, you can externally pass a component to customize the control rendering result. #11322
    • 🌟 The twoToneColor property is added to control the theme color of the two-color icon. #11971
    • 🌟 Added static methods Icon.getTowToneColor() and Icon.setTwoToneColor(...) to globally get and set the theme color of all two-color icons. #11971
    • 🌟 The new static method Icon.createFromIconfontCN({...}) is added to make it easier to use icons hosted on iconfont.cn. For more usage, please refer to Ant Design Pro - Introduction to Business Icons. #11322
  • 🔥 Added a new component Skeleton.
  • 🔥 Menu will automatically close up to fit width in horizontal mode.
  • 🔥 The placement of the drawer supports top and bottom to accommodate more scenes.

In addition, our Ant Design Pro 2.0.0 version has also been released simultaneously, please see our release note for details.

Bugfix/Feature

  • 🌟 Added Model.open for optional icon dialog. #11982 @hsiehjack
  • 🌟 Modal.info adds the configuration of getContainer. #11377
  • 🌟 Improve RangePicker footer UI by merging them.
  • 🌟 The Anchor component adds onClick property. #11898
  • 🌟 The Tab component adds the renderTabBar property. #11856
  • 🌟 The Input component adds the select method. #11906
  • 🌟 Steps adds the initial attribute. #11180
  • 🐞 Fixed Steps dot style broken.
  • 🐞 Fixed an issue where setting fontSize in the headStyle of the Card does not work. #11995
  • 🐞 Fixed an issue where the Button component wave animation was mix up. #11985
  • 🐞 Fixed an issue where the Modal.confirm setting centered attribute didn't work. #11969
  • 🐞 Fixed an issue where setting the suffix and prefix of the second Input in the compact mode of Input.Group would cause the right border to disappear. #11965
  • 🐞 Fixed an issue where Upload components might cause misplaced images when uploading many images. #11183
  • 🐞 Fixed MonthPicker renderExtraFooter not working. #8184

在开学之际我们带来了久违的 3.9.0 的更新。多个重量级的新特性和大量修复，使 Ant Design 的能力显著提升。

  • 🔥🔥🔥 在 3.9.0 版本中，我们重绘了所有的图标，新增了两大类，超过 90 个新图标，并且为每个图标增加了多种风格。为此我们重写了 Icon 组件，使用 SVG 替换了 fontface 图标，增加了多个特性，可以快速的使用新的图标和风格。
    • 💄 使用 SVG 图标替换了 css 字体图标，可以看这里的讨论了解 svg 的优势。
    • 💄 提供了三套图标风格线性、实色和双色图标，默认为线性风格。
    • 🌟 新增了 编辑类 和 数据类 两个新类别。
    • 🌟 新增 theme 属性，可以设置图标的主题风格。#11971
    • 🌟 新增 component 属性，可以外部传入一个组件来自定义控制渲染结果。#11322
    • 🌟 新增 twoToneColor 属性，可以控制双色图标的主题色。#11971
    • 🌟 新增静态方法 Icon.getTowToneColor() 和 Icon.setTwoToneColor(...)，可以全局性的获取和设置所有双色图标的主题色。#11971
    • 🌟 新增静态方法 Icon.createFromIconfontCN({...})，可以更加方便地使用 iconfont.cn 上托管的图标。更多用法请参阅 Ant Design Pro - 业务图标 的介绍。#11322
  • 🔥 增加了一个新组件 Skeleton。
  • 🔥 Menu 在 horizontal 模式下会自动收起来适应宽度。
  • 🔥 Drawer 的 placement 支持 top 和 bottom，可以适应更多场景。

另外我们的 Ant Design Pro 2.0.0 也已同步发布，详细内容请看 pro 2.0 发布日志。

组件修复/功能增强

  • 🌟 新增 Model.open 方法，用于可自定义图标的快捷对话框。#11982 @hsiehjack
  • 🌟 Modal.info 增加 getContainer 的配置。#11377
  • 🌟 合并优化了 RangePicker 的日历页脚 UI。
  • 🌟 Anchor 组件增加 onClick 属性。#11898
  • 🌟 Tab 组件增加 renderTabBar 属性。#11856
  • 🌟 Input 组件增加 select 方法。#11906
  • 🌟 Steps 增加 initial 属性。#11180
  • 🐞 修复 Steps 点状步骤条样式错位的问题。7d59075
  • 🐞 修复在 Card 的 headStyle 中设置 fontSize 不生效的问题。#11995
  • 🐞 修复了 Button 组件波浪动画混淆的问题。#11985
  • 🐞 修复了 Modal.confirm 设置 centered 属性无效的问题。#11969
  • 🐞 修复了在 Input.Group 的 compact 模式下设置第二个 Input 的前后缀会造成右边框消失的问题。 #11965
  • 🐞 修复 Upload 组件上传图片较多时可能会造成图片错位的问题。#11183
  • 🐞 修复 MonthPicker renderExtraFooter 失效的问题。#8184