antd3+hook如何写form表单

Ant Design 3.x 版本中，可以使用 `Form.create()` 方法创建一个高阶组件，将表单组件包裹起来，实现表单的数据绑定、校验等功能。

以下是使用 `Form.create()` 方法创建 Ant Design 3.x 版本的表单组件的示例代码：

import React, { useState } from 'react';
import { Form, Input, Button } from 'antd';

const FormItem = Form.Item;

const ExampleForm = ({ form }) => {
  const { getFieldDecorator, validateFields } = form;

  const handleSubmit = (e) => {
    e.preventDefault();
    validateFields((errors, values) => {
      if (!errors) {
        console.log(values); // 表单提交的数据
      }
    });
  };

  return (
    <Form onSubmit={handleSubmit}>
      <FormItem label="用户名">
        {getFieldDecorator('username', {
          rules: [{ required: true, message: '请输入用户名' }],
        })(<Input placeholder="请输入用户名" />)}
      </FormItem>
      <FormItem label="密码">
        {getFieldDecorator('password', {
          rules: [{ required: true, message: '请输入密码' }],
        })(<Input type="password" placeholder="请输入密码" />)}
      </FormItem>
      <FormItem>
        <Button type="primary" htmlType="submit">提交</Button>
      </FormItem>
    </Form>
  );
};

export default Form.create()(ExampleForm);

上述代码中，通过 `Form.create()` 方法创建了一个高阶组件，并将表单组件 `ExampleForm` 作为参数传递给它，经过处理后返回一个新的包裹了表单组件的组件。

在表单组件中，使用 `getFieldDecorator` 方法包装表单控件，实现表单值的双向绑定和校验规则的设置。`validateFields` 方法用于表单数据校验，如果校验通过则将表单数据提交到后端。