antd 4.x.x Form组件 表单提交 值清空问题

Form组件 表单提交时表单内容的控制

目的：表单内容的清空与否，自主控制

未控制情况下

const onFinish = (value) => {console.log(value)}<Form onFinish={onFinish} ><Form.Item name='editValue' ><Input.TextArea rows={4} /></Form.Item><Form.Item><Button htmlType="submit" type="primary">提交</Button></Form.Item></Form>

上述代码点击提交之后，表单内容会自动清空。组件会刷新。当提交出问题时，，内容已经丢失，无法在原有基础下再次提交。

使用 form 进行实例化

const [form] = Form.useForm();const onFinish = (value) => {console.log(value)}<Form onFinish={onFinish} ><Form.Item name='editValue' form={form} ><Input.TextArea rows={4} /></Form.Item><Form.Item><Button htmlType="submit" type="primary">提交</Button></Form.Item></Form>

经过实例化后，表单内容变为自主控制，提交操作并不会导致原有内容清空，需要通过 FormInstance 来进行操作

个人见解，欢迎指正