如何根据ReactJS中表单的状态进行输入验证和禁用/启用提交按钮

import React, { useState } from 'react';

const Form = () => {
  const [name, setName] = useState('');
  const [email, setEmail] = useState('');
  const [errorMessage, setErrorMessage] = useState('');
  
  const handleNameChange = (event) => {
    setName(event.target.value);
  };
  
  const handleEmailChange = (event) => {
    setEmail(event.target.value);
  };
  
  const handleSubmit = (event) => {
    event.preventDefault();
    
    // Perform form submission logic here
  };
  
  const isFormValid = () => {
    // Perform input validation logic here
    if (name === '' || email === '') {
      setErrorMessage('Please fill in all fields.');
      return false;
    }
    
    setErrorMessage('');
    return true;
  };
  
  return (
    <form onSubmit={handleSubmit}>
      <div>
        <label htmlFor="name">Name:</label>
        <input type="text" id="name" value={name} onChange={handleNameChange} />
      </div>
      <div>
        <label htmlFor="email">Email:</label>
        <input type="email" id="email" value={email} onChange={handleEmailChange} />
      </div>
      <div>
        <button type="submit" disabled={!isFormValid()}>Submit</button>
      </div>
      {errorMessage && <p>{errorMessage}</p>}
    </form>
  );
};

export default Form;