Défi : Créer un Composant de Formulaire Contrôlé
Tâche
Dans ce défi, il s'agit de créer un composant Form avec deux champs de saisie : email et password. L'objectif est d'utiliser le hook useRef pour référencer les éléments d'entrée et gérer la logique de soumission du formulaire.
Instructions
- Importer le hook
useRefdepuis la bibliothèquereact. - À l'intérieur du composant
Form, déclarer deux variablesuseRef:emailRefetpasswordRef, initialisées ànull. - Réinitialiser les champs de saisie en définissant leur valeur sur une chaîne vide à l'aide des variables
useRef.
- Pour importer le hook nécessaire depuis la bibliothèque React, inclure une instruction
import. - Pour cette tâche, le hook
useRefsera utilisé afin de stocker des données sans affecter le balisage. - Pour déterminer le nom de variable approprié pour la référence, choisir un mot associé à la référence et ajouter "Ref" à la fin.
- Pour initialiser la référence avec
null, passernullcomme valeur initiale entre les parenthèses du hookuseRef(par exemple,useRef(null)). - Pour réinitialiser le champ du formulaire, utiliser la variable de référence appropriée et affecter à sa propriété
.current.valueune chaîne vide ("").
Tout était clair ?
Merci pour vos commentaires !
Section 3. Chapitre 5
Demandez à l'IA
Demandez à l'IA
Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion
Awesome!
Completion rate improved to 2.17
Défi : Créer un Composant de Formulaire Contrôlé
Glissez pour afficher le menu
Tâche
Dans ce défi, il s'agit de créer un composant Form avec deux champs de saisie : email et password. L'objectif est d'utiliser le hook useRef pour référencer les éléments d'entrée et gérer la logique de soumission du formulaire.
Instructions
- Importer le hook
useRefdepuis la bibliothèquereact. - À l'intérieur du composant
Form, déclarer deux variablesuseRef:emailRefetpasswordRef, initialisées ànull. - Réinitialiser les champs de saisie en définissant leur valeur sur une chaîne vide à l'aide des variables
useRef.
- Pour importer le hook nécessaire depuis la bibliothèque React, inclure une instruction
import. - Pour cette tâche, le hook
useRefsera utilisé afin de stocker des données sans affecter le balisage. - Pour déterminer le nom de variable approprié pour la référence, choisir un mot associé à la référence et ajouter "Ref" à la fin.
- Pour initialiser la référence avec
null, passernullcomme valeur initiale entre les parenthèses du hookuseRef(par exemple,useRef(null)). - Pour réinitialiser le champ du formulaire, utiliser la variable de référence appropriée et affecter à sa propriété
.current.valueune chaîne vide ("").
Tout était clair ?
Merci pour vos commentaires !
Section 3. Chapitre 5