Action (React Router)

Définition

Fonction associée à une route qui traite les mutations (POST, PUT, DELETE) soumises par un <Form>. Après l'action, React Router revalide automatiquement les loaders de la page. Depuis la v8 (17 juin 2026), l'action peut être précédée d'un middleware (auth, contexte), activé par défaut.

Analogie

Comme la boite aux lettres d'un bureau : tu deposes ton courrier (formulaire), le bureau (action) le traite.

Exemple de code

import { redirect } from 'react-router';
import type { Route } from './+types/new-user';

export async function action({ request }: Route.ActionArgs) {
  const form = await request.formData();
  await api.createUser(Object.fromEntries(form));
  return redirect('/users');   // les loaders sont revalidés
}
// <Form method="post"> déclenche l'action sans JS custom

Cas d'usage

Gérer les soumissions de formulaires avec revalidation automatique des loaders après mutation.

Termes liés

Sources

• reactrouter.com/changelog
• reactrouter.com/how-to/middleware