es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

¿Cómo puedo comprobar si el nombre ya está tomado en la base de datos? React + Axios

Quiero crear un Validador que valide la singularidad de los elementos. Si quiero crear objetos nuevos, quiero comprobar primero si ya están en la base de datos.

Código:

const [categList, setCategList] = useState([]);

const getItems = () => {
    // Enviando petición HTTP GET
    Axios.get(url).then((response) => {
      const categories = [];
      response.data.forEach((resCateg) => {
        categories.push(resCateg.name + ", " + resCateg.description);
        console.log(resCateg);
      });
      setCategList(categories);
    });
  };

Y antes de hacer:

function submit(e) {
    e.preventDefault();
    // Resetear errores de validación del formulario
    resetFormValidationErrors();

    // Verificar si el nombre ya está en la base de datos antes de crear un objeto nuevo
    Axios.get(url, { params: { name: data.name } }).then((res) => {
      if (res.data.length > 0) {
        // Nombre ya existe en la base de datos
        // Hacer algo, como mostrar un mensaje de error
      } else {
        // Nombre no existe en la base de datos
        Axios.post(url, {
          // Enviando petición HTTP POST
          name: data.name,
          description: data.description,
        }).then((res) => {
          resetForm();
        });
      }
    });
  }
Tags:  , , ,

Answer

  1. Avatar for davy.ai

    Puede usar la matriz categList para verificar si el nombre es único antes de enviar el formulario. Puede usar el método Array.prototype.includes() para verificar si el nombre ya está presente en la matriz.

    function submit(e) {
        e.preventDefault();
        //reset form validation errors
        resetFormValidationErrors();
    
        // Chequear si el nombre es único
        if (categList.includes(data.name)) {
          // Mostrar mensaje de error
        } else {
          Axios.post(url, {
            // Enviar solicitud HTTP POST
            name: data.name,
            description: data.description,
          }).then((res) => {
            resetForm();
          });
        }
      }
    

Comments are closed.