1
respuesta

Duda

Referente al curso React: Function Components, en el capítulo Manejo de errores y actividad Creando una función de validación

por Santiago Rivas Molina
| 88.1k xp | 18 posts

Hola Equipo Alura, tengo una duda respecto al porqué el 'message' de error se ponen dos veces, por ejemplo he hecho pruebas y noto que el mensaje que se muestra al usuario es el de la función 'validarNombre', ¿porque en el useState también se incluye el mensaje, pero este nunca se utiliza?, abajo dejo el usaState y la función de validarNombre:

const [errors,setErrors] = useState({
        name:{
        error:false,
        message:'Deben ser almenos tres caracteres',
        }
        })
        
          const validarNombre = (nombre) => {
        if(nombre.length >= 3){
            return {
                name:{error:false, message:''}
            }
        }else {
            return {
                name:{error:true, message:'Deben ser almenos tres caracteres'}
            } 
        }

    }
1 respuesta
por Bruno Botelho de Souza
| 3905.5k xp | 14841 posts
Alura Scuba Team Scuba Team | Front-end

Hola Santiago,

Entiendo tu confusión y creo que puedo ayudarte a aclararla. En tu código, el estado inicial de 'errors' se define con un objeto que tiene una propiedad 'name'. Esta propiedad 'name' es otro objeto que contiene dos campos: 'error' y 'message'. El campo 'message' se inicializa con el texto 'Deben ser al menos tres caracteres'. Esto es simplemente un estado inicial y no se muestra al usuario a menos que se cumpla la condición en la función 'validarNombre'.

La función 'validarNombre' es la que realmente maneja la validación del nombre ingresado por el usuario. Si el nombre ingresado tiene menos de tres caracteres, la función devuelve un objeto con 'error' establecido en 'true' y 'message' con el mismo texto que antes. Este objeto se usa para actualizar el estado de 'errors' y, como 'error' es 'true', el mensaje se muestra al usuario.

Por otro lado, si el nombre ingresado tiene tres caracteres o más, la función devuelve un objeto con 'error' establecido en 'false' y 'message' como una cadena vacía. Este objeto se usa para actualizar el estado de 'errors' y, dado que 'error' es 'false', no se muestra ningún mensaje al usuario.

Es importante notar que aunque el mensaje en el estado inicial y en la función 'validarNombre' es el mismo, no tienen que serlo necesariamente. Podrías tener un mensaje diferente en el estado inicial y cambiarlo en la función 'validarNombre' dependiendo de la validación.

Espero que esto aclare tu duda. Si tienes alguna otra pregunta sobre este tema, no dudes en hacerla.

¡Saludos!

Si este post te ayudó, por favor marca como solucionado ✓. ¡Continúa con tus estudios!