React — React Forms with Validation

You can validate form inputs in React manually or using libraries like Formik or React Hook Form. This ensures that users input the correct data format.

import React, { useState } from 'react';

function Form() {
  const [email, setEmail] = useState('');
  const [error, setError] = useState('');

  const handleSubmit = (e) => {
    e.preventDefault();
    if (!email.includes('@')) {
      setError('Invalid email address');
    } else {
      setError('');
      alert('Submitted');
    }
  };

  return (
    <form onSubmit={handleSubmit}>
      <input
        type=\"email\"
        value={email}
        onChange={(e) => setEmail(e.target.value)}
      />
      {error && <p style={{ color: 'red' }}>{error}</p>}
      <button type=\"submit\">Submit</button>
    </form>
  );
}