react antd form表单点击确定时可以自动定位到未填写项

可以通过在表单中添加`onFinishFailed`属性来实现这个功能。当用户点击提交按钮但表单中存在未填写的项时，`onFinishFailed`会被触发，你可以在该函数中获取到未填写项的相关信息，然后通过一些方式将焦点定位到该项上，让用户快速填写。以下是一个示例代码：

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

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

  const onFinishFailed = (errorInfo) => {
    // 获取到未填写项的相关信息
    const { errorFields } = errorInfo;

    // 将焦点定位到第一个未填写项上
    const errorField = errorFields[0];
    const { name } = errorField;
    const input = form.getFieldInstance(name);
    input.focus();
  };

  return (
    <Form
      form={form}
      onFinish={() => console.log('提交成功！')}
      onFinishFailed={onFinishFailed} // 添加 onFinishFailed 属性
    >
      <Form.Item
        label="用户名"
        name="username"
        rules={[{ required: true, message: '请输入用户名' }]}
      >
        <Input />
      </Form.Item>

      <Form.Item
        label="密码"
        name="password"
        rules={[{ required: true, message: '请输入密码' }]}
      >
        <Input.Password />
      </Form.Item>

      <Form.Item>
        <Button type="primary" htmlType="submit">
          提交
        </Button>
      </Form.Item>
    </Form>
  );
};

export default DemoForm;

在上面的代码中，我们在`Form`组件中添加了`onFinishFailed`属性，并在该函数中获取到了未填写项的相关信息，然后将焦点定位到第一个未填写项上。