Desafío: Crear un Componente de Formulario Controlado
Tarea
En este desafío, se debe crear un componente Form con dos campos de entrada: email y password. El objetivo es utilizar el hook useRef para referenciar los elementos de entrada y gestionar la lógica de envío del formulario.
Instrucciones
- Importar el hook
useRefdesde la bibliotecareact. - Dentro del componente
Form, declarar dos variables deuseRef:emailRefypasswordRef, inicializadas connull. - Restablecer los campos de entrada asignando una cadena vacía a sus valores mediante las variables de
useRef.
- Para importar el hook necesario desde la biblioteca React, incluir una declaración
import. - Para esta tarea, se utilizará el hook
useRefpara almacenar datos sin afectar el marcado. - Para determinar el nombre de variable adecuado para la referencia, elegir una palabra asociada con la referencia y añadir "Ref" al final.
- Para inicializar la referencia con
null, pasarnullcomo valor inicial entre los paréntesis del hookuseRef(por ejemplo,useRef(null)). - Para restablecer la entrada del formulario, utilizar la variable de referencia correspondiente y asignar su
.current.valuea una cadena vacía ("").
¿Todo estuvo claro?
¡Gracias por tus comentarios!
Sección 3. Capítulo 5
Pregunte a AI
Pregunte a AI
Pregunte lo que quiera o pruebe una de las preguntas sugeridas para comenzar nuestra charla
Awesome!
Completion rate improved to 2.17
Desafío: Crear un Componente de Formulario Controlado
Desliza para mostrar el menú
Tarea
En este desafío, se debe crear un componente Form con dos campos de entrada: email y password. El objetivo es utilizar el hook useRef para referenciar los elementos de entrada y gestionar la lógica de envío del formulario.
Instrucciones
- Importar el hook
useRefdesde la bibliotecareact. - Dentro del componente
Form, declarar dos variables deuseRef:emailRefypasswordRef, inicializadas connull. - Restablecer los campos de entrada asignando una cadena vacía a sus valores mediante las variables de
useRef.
- Para importar el hook necesario desde la biblioteca React, incluir una declaración
import. - Para esta tarea, se utilizará el hook
useRefpara almacenar datos sin afectar el marcado. - Para determinar el nombre de variable adecuado para la referencia, elegir una palabra asociada con la referencia y añadir "Ref" al final.
- Para inicializar la referencia con
null, pasarnullcomo valor inicial entre los paréntesis del hookuseRef(por ejemplo,useRef(null)). - Para restablecer la entrada del formulario, utilizar la variable de referencia correspondiente y asignar su
.current.valuea una cadena vacía ("").
¿Todo estuvo claro?
¡Gracias por tus comentarios!
Sección 3. Capítulo 5