Pass a function to the form action prop for submissions

In React 19 a <form> can take a function as its action. React then:

• calls it with the form's FormData inside a transition,
• tracks the pending state,
• resets uncontrolled fields after a successful submit.

You no longer need onSubmit, preventDefault and a manual isLoading flag for every form.

Use uncontrolled inputs with name attributes and read them from FormData. Keep controlled inputs for cases where you must react to every keystroke, such as live validation or formatting.

function NewsletterForm() {
  async function subscribe(formData: FormData) {
    await saveEmail(String(formData.get('email')));
  }
  return (
    <form action={subscribe}>
      <input name="email" type="email" required />
      <SubmitButton />
    </form>
  );
}