Défi : Créer un Composant de Formulaire
Tâche
Dans ce défi, vous allez 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
- Importez le hook
useRef
de la bibliothèquereact
. - À l'intérieur du composant
Form
, déclarez deux variablesuseRef
:emailRef
etpasswordRef
, initialisées avecnull
. - Réinitialisez les champs de saisie en définissant leurs valeurs sur une chaîne vide en utilisant les variables
useRef
.
- Pour importer le hook nécessaire de la bibliothèque React, incluez une instruction
import
. - Pour cette tâche, nous utiliserons le hook
useRef
pour stocker des données sans affecter le balisage. - Pour déterminer le nom de variable approprié pour le ref, choisissez un mot associé au ref et ajoutez "Ref" à la fin.
- Pour initialiser le ref avec
null
, passeznull
comme valeur initiale dans les crochets du hookuseRef
(par exemple,useRef(null)
). - Pour réinitialiser l'entrée du formulaire, utilisez la variable ref appropriée et assignez sa valeur
.current.value
à une 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
Glissez pour afficher le menu
Tâche
Dans ce défi, vous allez 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
- Importez le hook
useRef
de la bibliothèquereact
. - À l'intérieur du composant
Form
, déclarez deux variablesuseRef
:emailRef
etpasswordRef
, initialisées avecnull
. - Réinitialisez les champs de saisie en définissant leurs valeurs sur une chaîne vide en utilisant les variables
useRef
.
- Pour importer le hook nécessaire de la bibliothèque React, incluez une instruction
import
. - Pour cette tâche, nous utiliserons le hook
useRef
pour stocker des données sans affecter le balisage. - Pour déterminer le nom de variable approprié pour le ref, choisissez un mot associé au ref et ajoutez "Ref" à la fin.
- Pour initialiser le ref avec
null
, passeznull
comme valeur initiale dans les crochets du hookuseRef
(par exemple,useRef(null)
). - Pour réinitialiser l'entrée du formulaire, utilisez la variable ref appropriée et assignez sa valeur
.current.value
à une chaîne vide (""
).
Tout était clair ?
Merci pour vos commentaires !
Section 3. Chapitre 5