ant-design/docs/react/upgrade-notes.md
2016-11-18 15:38:36 +08:00

6.5 KiB
Raw Blame History

order title
6
zh-CN en-US
升级指南 Upgrade Notes

此处着重列出升级中的不兼容变化和推荐改动。所有变动请见 更新日志

1.x => 2.x

1.0.0 之后将不再单独提供升级指南,请参考对应版本 更新日志 中的 不兼容改动 部分进行升级。

0.12 => 1.x

1.0.0 之后将不再单独提供升级指南,请参考对应版本 更新日志 中的 不兼容改动 部分进行升级。

0.11 => 0.12


使用 Form 提供的校验功能代替 Validation

Validation 已经被废弃,并会在以后的版本完全移除,所以建议尽快使用 Form 自带的校验功能替换 Validation。具体使用方式可以查阅文档和例子#1 #2 #3)。

Progress format 属性的值改为函数

把使用了 format 属性的代码,如:

<Progress.Circle percent={100} format={<Icon type="check" />} />

改为:

<Progress.Circle percent={100} format={() => <Icon type="check" />} />

Tree

  • onSelect 回调函数,由原来的一个参数,变为两个,第一个为selectedKeys,第二个参数为原来第一个参数里的其余信息。另外selectedKeys里包含了当前选中的节点key而原来的不包含。
  • onCheck 回调函数,由原来的一个参数,变为两个,第一个为checkedKeys,第二个参数为原来第一个参数里的其余信息。另外checkedKeys里包含了当前选中的节点key而原来的不包含这样免去业务里自己组装key的工作
  • 异步API中onDataLoaded重命名为loadData,其他不用改。

0.10 => 0.11


0.11.x 版本有大量更新,其中部分为不兼容更新。以下列表为其中不兼容的更新及对应升级方案。如果您在升级过程中遇到下面没有提到的情况,可以到 Github 上面咨询。

默认加载样式

样式现在不再会在 antd 中默认加载,如果升级后没有样式,开发者需要手动自行引入样式。

import 'antd/lib/index.css';
// 或者
import 'antd/style/index.less';

表格远程模式

TabledataSource 远程模式被移除用户需要自行实现数据获取方式ajax 获取数据的演示可以参见 演示

Timepicker、Datepicker 重命名

Timepicker 被重命名为 TimePickerDatepicker 被重命名为 DatePicker,需要做以下改动:

<Timepicker /> ==> <TimePicker />
<Datepicker /> ==> <DatePicker />

相应的,两个组件的文档地址也改为 /components/date-picker/components/time-picker

受控的 DatePicker

由于 DatePicker 已改为 受控组件,所以 DatePicker 显示的值必然与其 value 一致。

如果无法理解受控组件,只须在发现在选中日期后 Datepicker 显示的值不变的情况后,把其 value 属性改为 defaultValue 即可。

TimePicker locale 结构改变

属性 locale 结构发生了 变化,需要将原有的属性改为现有的结构

其他

  • Alert 组件默认不展示样式,可以用 showIcon 属性添加图标。
  • 0.10.x 中 Datepicker 已废弃的 onSelect 属性被删除,请使用 onChange 属性。。
  • TimePicker 的 hourOptions minuteOptions secondOptions 属性已移除,可使用 disabledHours disabledMinutes disabledSeconds 配和 hideDisabled 属性来完成原有功能。演示

0.9 => 0.10


0.10.x 版本有大量改动,是一个不完全向下兼容的版本。以下文档尽力列出了 0.9.x0.10.x 的不兼容变动,以帮助开发者升级。

升级 React

新版本推荐使用 react@0.14.x 及以上版本,并增加了对低版本 react 的警告。建议进行同步升级,参考官方的升级文档

组件化改造

此版本对 ButtonIconfontLayoutFormInput 模块进行了 React 组件化的改造,请基于新的使用方式修改,原有的书写方式理论上无影响。

例如:

<button className="ant-btn ant-btn-primary">按 钮</button>
  ==>
<Button type="primary">按钮</Button>
<i className="anticon anticon-appstore"></i>
  ==>
<Icon type="appstore" />

size 属性统一

原有组件的 size 属性统一为大中小:large default small,包括 Button Table Tabs Steps Select Pagination InputNumber Datepicker

例如:

<Tabs size="mini"> ... </Tabs>
  ==>
<Tabs size="small"> ... </Tabs>

详情可参考:https://github.com/ant-design/ant-design/issues/415

其他

  • enter-animation 组件下线, 请使用 queue-anim 来代替。
  • Carousel 升级依赖,参考新的新的 API 和使用方式进行修改。
  • antd.Notification() 修改为小写的 antd.notification()
  • Datepicker 的 onSelect 属性修改为 onChange 属性。
  • Datepicker 的 calendarStyle 属性修改为 popupStyle 属性。
  • Dropdown 的 onSelect 属性应修正为 onClick 属性,因为原有的 onSelect 只在变化时触发。
  • Slider 的 withDots isIncluded 属性修改为 dots included
  • iconfont 的基线更新,可能导致原有图标的位置偏移。

新版本变化较大,以上升级指南可能有遗漏,全部改动可以参考 更新日志。在升级过程中遇到问题,欢迎 报告 给我们。