antd form 回车提交

如果您想在 antd form 中按回车键时提交表单，可以在 Form 组件上添加 onSubmit 属性，并在该函数中阻止默认的表单提交行为，然后调用 form 的 submit 方法来手动提交表单。以下是一个示例代码：

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

const layout = {
  labelCol: {
    span: 8,
  },
  wrapperCol: {
    span: 16,
  },
};

const tailLayout = {
  wrapperCol: {
    offset: 8,
    span: 16,
  },
};

const DemoForm = () => {
  const [form] = Form.useForm();

  const handleSubmit = (e) => {
    e.preventDefault();
    form.submit();
  };

  return (
    <Form {...layout} form={form} onFinish={onFinish} onSubmit={handleSubmit}>
      <Form.Item
        label="Username"
        name="username"
        rules={[
          {
            required: true,
            message: 'Please input your username!',
          },
        ]}
      >
        <Input />
      </Form.Item>

      <Form.Item
        label="Password"
        name="password"
        rules={[
          {
            required: true,
            message: 'Please input your password!',
          },
        ]}
      >
        <Input.Password />
      </Form.Item>

      <Form.Item {...tailLayout}>
        <Button type="primary" htmlType="submit">
          Submit
        </Button>
      </Form.Item>
    </Form>
  );
};

在上面的代码中，我们在 Form 组件上添加了 onSubmit 属性，并在 handleSubmit 函数中阻止默认的表单提交行为，然后调用 form 的 submit 方法来手动提交表单。