表单验证isSubmitting / isValidating未设置为true

import React, { useState } from 'react';

const FormComponent = () => {
  const [isSubmitting, setIsSubmitting] = useState(false);
  const [isValidating, setIsValidating] = useState(false);
  const [formData, setFormData] = useState({});

  const handleSubmit = async (event) => {
    event.preventDefault();
    setIsValidating(true);

    // 模拟验证过程
    const validationResult = await validateForm(formData);
    if (validationResult.isValid) {
      setIsSubmitting(true);
      // 模拟提交过程
      await submitForm(formData);
      setIsSubmitting(false);
    } else {
      setIsValidating(false);
    }
  };

  const validateForm = (data) => {
    // 模拟验证逻辑
    return new Promise((resolve) => {
      setTimeout(() => {
        const isValid = true; // 替换为实际的验证逻辑
        resolve({ isValid });
      }, 1000);
    });
  };

  const submitForm = (data) => {
    // 模拟提交逻辑
    return new Promise((resolve) => {
      setTimeout(() => {
        console.log('Form submitted:', data);
        resolve();
      }, 1000);
    });
  };

  return (
    <form onSubmit={handleSubmit}>
      {/* 表单输入组件 */}
      <button type="submit" disabled={isSubmitting}>
        Submit
      </button>
    </form>
  );
};

export default FormComponent;