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
3.调用form方法调整
Form 自带表单控制实体,如需要调用 form 方法,可以通过 Form.useForm() /React.createRef()创建 Form 实体进行操作,v4中如果你是3-1的写法,用Form.useForm()来获得form实体,具体见3-2,若你是3-3的写法用React.createRef()获得form实体,具体见3-4
4.onFinish 替代 onSubmit
v3中的提交验证,onSubmit要手动触发validateFields(见4-1),v4中改成onFinish,该事件是验证通过的时候才执行(见4-2)
5. validateFieldsAndScroll方法的废弃
v3的validateFieldsAndScroll方法,是将成功与失败聚合在一起的(见5-1),v4中是将成功与失败拆分成了两个方法(见5-2),onFinish方法本身就是验证成功之后执行的函数,所以不必再验证失败的情况,若想失败的时候执行另一套逻辑,只需在Form中再添加一个onFinishFailed函数将逻辑写入onFinishFailed函数中即可
6.嵌套字段路径使用数组
在v3中的写法是以"."的形式书写(见6-1),v4中更改了以数组的形式呈现(见6-2)