LU02a - Simple Form

Formulare in React sind eine grundlegende Möglichkeit, um Benutzereingaben zu erfassen und zu verarbeiten. Im Unterschied zu normalen HTML-Formularen werden die Eingaben von React über den State kontrolliert. Dadurch können Sie Eingaben validieren und dynamisch auf Änderungen reagieren.

import { useState } from 'react';
 
export default function Formular() {
  const [firstName, setFirstName] = useState('');
  const [lastName, setLastName] = useState('');
 
  const handleSubmit = (e) => {
    e.preventDefault();
    alert(`Gespeicherter Name: ${name}`);
  };
 
  return (
    <form onSubmit={handleSubmit}>
      <label>
        Firstname:
        <input
          type="text"
          value={firstName}
          onChange={(e) => setFirstName(e.target.value)}
        />
      </label>
      <label>
        Lastname:
        <input
          type="text"
          value={lastName}
          onChange={(e) => setLastName(e.target.value)}
        />
      </label>
      <button type="submit">Absenden</button>
    </form>
  );
}