步骤如下:
- 安装最新版本antd,升级项目 React 16.12.0 以上
- Form及对应Icon引用路径变更为@ant-design/compatible(适配class组件),若是hooks组件可直接引用antd。后期升级变更为引用antd需要将class组件升级为hooks
- @ant-design/compatible引用后会出现样式错乱,需要将对应样式文件一起引入
import { Form, SmileOutlined, Icon } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.less';
- 使用@ant-design/compatible的form 类名调整,如
ant-form-item==>ant-legacy-form-item,需要做兼容 - 若表单设置的Grid样式不生效,报如下错误,需要手动引入
import 'antd/es/grid/style/css';
- Form表单方法废弃
废弃: Form.create ==> Form.useForm()
name层级嵌套 'a.b' ===> ['a', 'b']
validateTrigger
defaultValue ==> initValue
initialValues优先级高于initialValue
- DatePicker
交互重做,面板和输入框分离,范围选择现可单独选择开始和结束时间
ant-calendar-date ==> ant-picker-cell-inner
- Table 默认背景颜色从透明修改为白色。
Table 移除了在 v3 中废弃的 onRowClick、onRowDoubleClick、onRowMouseEnter、onRowMouseLeave 等方法。
dataIndex 从支持路径嵌套如 user.age ==> ['user', 'age']
-
Tabs 火柴棍样式缩短为和文字等长。
-
Tabs 交互重做,DOM 结构改变。
-
moment.js==>dayjs