Mensajes de error

¡Hola Luis!

Para validar varios inputs en React, puedes crear una función de validación para cada input y luego llamar a esas funciones en el evento onSubmit del formulario.

Por ejemplo, si tienes un input para el nombre y otro para el apellido, puedes crear dos funciones de validación separadas, una para cada input. Luego, en el evento onSubmit del formulario, puedes llamar a ambas funciones de validación.

Aquí hay un ejemplo de cómo podrías hacerlo:

import React, { useState } from "react";

function Formulario() {
  const [nombre, setNombre] = useState("");
  const [apellido, setApellido] = useState("");

  function validarNombre() {
    // Aquí puedes agregar la lógica de validación para el input del nombre
  }

  function validarApellido() {
    // Aquí puedes agregar la lógica de validación para el input del apellido
  }

  function handleSubmit(event) {
    event.preventDefault();
    validarNombre();
    validarApellido();
  }

  return (
    <form onSubmit={handleSubmit}>
      <label>
        Nombre:
        <input type="text" value={nombre} onChange={(e) => setNombre(e.target.value)} />
      </label>
      <br />
      <label>
        Apellido:
        <input type="text" value={apellido} onChange={(e) => setApellido(e.target.value)} />
      </label>
      <br />
      <button type="submit">Enviar</button>
    </form>
  );
}

export default Formulario;

Espero que esto te ayude a resolver tu problema. ¡Si tienes alguna otra pregunta, no dudes en preguntar! ¡Espero haber ayudado y buenos estudios!