Ant Design 表单中getFieldDecorator、getFieldValue、setFieldValue用法

getFieldDecorator、getFieldValue、setFieldValue 是 Ant Design 表单中的常用 API，它们的作用如下：

1. getFieldDecorator

getFieldDecorator 是用于把组件和表单进行关联的 API，它的作用是将一个非受控组件转换为受控组件，同时还可以实现双向数据绑定。通过 getFieldDecorator 包装的组件，表单控件会自动添加 onChange、value 等属性，并与表单进行双向绑定。

getFieldDecorator 的使用方法如下：

<Form.Item>
  {getFieldDecorator('username', {
    rules: [{ required: true, message: '请输入用户名' }],
  })(<Input placeholder="请输入用户名" />)}
</Form.Item>

2. getFieldValue

getFieldValue 是用于获取表单字段值的 API，通过指定表单字段名称（name），可以获取到对应表单字段的值。注意，getFieldValue 只能获取到已经包装过的表单字段的值，如果表单字段没有包装过，则会返回 undefined。

getFieldValue 的使用方法如下：

const username = getFieldValue('username');
console.log(username);

3. setFieldValue

setFieldValue 是用于设置表单字段值的 API，通过指定表单字段名称（name）和要设置的值，可以设置对应表单字段的值。注意，setFieldValue 只能设置已经包装过的表单字段的值，如果表单字段没有包装过，则会报错。

setFieldValue 的使用方法如下：

setFieldValue('username', 'admin');