简介antd v3版本升级到v4

1.getFieldDecorator的废弃

之前v3版本的写法如下所示，在v4中整改了这种写法，v3中的getFieldDecorator是用于和表单进行双向绑定，原文档中是这种写法==getFieldDecorator(id, options) ==，id表示控件的唯一标识，options是表示getFieldDecorator里面的属性，下面的例子中的initialValue是getFieldDecorator的属性之一，表示表单域的默认值，rules属性表示校验规则，required表示是否必填，当需要必填时，设置required:true

在v4版本中，废弃了这种写法，改成了以下的方式,默认值提到父元素form中，以避免同名字段设置 initialValue 的冲突问题

2.v4 的 Form 不再需要通过 Form.create() 创建上下文

v3的写法如2-1所示，v4不再需要通过 Form.create() 创建上下文，见2-2

2-1

2-2

3.调用form方法调整

Form 自带表单控制实体，如需要调用 form 方法，可以通过 Form.useForm() /React.createRef()创建 Form 实体进行操作，v4中如果你是3-1的写法，用Form.useForm()来获得form实体，具体见3-2，若你是3-3的写法用React.createRef()获得form实体，具体见3-4

3-1

3-2

3-3

3-4

4.onFinish 替代 onSubmit

v3中的提交验证，onSubmit要手动触发validateFields（见4-1），v4中改成onFinish，该事件是验证通过的时候才执行（见4-2）

4-1

4-2

5. validateFieldsAndScroll方法的废弃

v3的validateFieldsAndScroll方法，是将成功与失败聚合在一起的（见5-1），v4中是将成功与失败拆分成了两个方法（见5-2）,onFinish方法本身就是验证成功之后执行的函数，所以不必再验证失败的情况，若想失败的时候执行另一套逻辑，只需在Form中再添加一个onFinishFailed函数将逻辑写入onFinishFailed函数中即可

5-1

6.嵌套字段路径使用数组

在v3中的写法是以"."的形式书写（见6-1），v4中更改了以数组的形式呈现（见6-2）

6-1

6-2