useFormStatus
React 🟡 MidDefinition
Hook qui donne l'etat de soumission du formulaire parent (pending, data, method, action). Doit etre utilise dans un composant enfant du <form>.
Analogie
Comme un indicateur lumineux sur une machine a cafe : il te dit si elle est en train de preparer (pending) ou prete.
Exemple de code
function SubmitButton() {
const { pending } = useFormStatus();
return (
<button disabled={pending}>
{pending ? 'Envoi...' : 'Envoyer'}
</button>
);
}
Cas d'usage
Desactiver le bouton submit et afficher un spinner pendant la soumission d'un formulaire avec Server Actions.
Anti-pattern
Utiliser useFormStatus dans le meme composant que le <form> : il doit etre dans un enfant.