1

Tengo mi aplicación en React, algo sencilla a mi parecer, pero el problema que tengo es que al querer agregar un contacto vacío ya sea número de teléfono o nombre sale que ya existe ese contacto, no entiendo por qué ya que tengo una línea de código la cual busca si ya existe ese nombre de contacto únicamente o no, pero no entiendo si están vacío esos campos porque lo reconoce como que ya existe.

Mi filtro únicamente encuentra coincidencias en el nombre, el número puede ser el mismo.

Líneas de código donde agrego un contacto

Si el contacto a agregar tiene el nombre de un contacto existente en la base de datos, salta un mensaje que dice si quiero actualizar el número de teléfono, pero si se agrega un contacto vacío salta el mismo mensaje mensaje y no entiendo el porque.

const addContact = (event) => {
    event.preventDefault();
    const personInfo = {
      name: newName,
      number: newNumber
    };
    
    // const duplyPerson = (persons.map(person => person.name));
    const findPerson = persons.find(personData => personData.name.includes(newName));
    const changedNumber = {...findPerson, number: newNumber};
    
    console.log(findPerson);
    
    if (findPerson) {
      
      if (window.confirm(`${newName} is already added to phonebook, replace the old number with a new one?`)) {
        
        personsService.updatePersonPhone(findPerson.id, changedNumber).then(returnedPersons => {
          setPersons(persons.map(note => note.id !== findPerson.id ? note : returnedPersons));
          setNewName('');
          setNewNumber('');
        });
        
      }
      
    } else {
      
      personsService.savePerson(personInfo)
                    .then(savePersonInfo => {
                      setPersons(persons.concat(savePersonInfo));
                      setNewName('');
                      setNewNumber('');
                    });
      
    }
};

Aplicación completa

Edit upbeat-swirles-9w1y2

1 respuesta 1

1

Podrías cambiar tu lógica para que cuando busques a la persona en cuestión lo hagas por el índice y si el índice coincide entonces procede a ejecutarse el if, caso contraria guardaría tu contacto normalmente. Aquí te adjunto la parte del código que deberías cambiar.

const duplyPerson = (persons.map(person => person.name));
if (duplyPerson.indexOf(newName) !== -1) {
      
      const findPerson = persons.find(personData => personData.name.includes(newName));
      const changedNumber = {...findPerson, number: newNumber};
      
      if (window.confirm(`${newName} is already added to phonebook, replace the old number with a new one?`)) {
        
        personsService.updatePersonPhone(findPerson.id, changedNumber).then(returnedPersons => {
          setPersons(persons.map(note => note.id !== findPerson.id ? note : returnedPersons));
          setNewName('');
          setNewNumber('');
        });
        
      }
    } else {
      
      personsService.savePerson(personInfo)
                    .then(savePersonInfo => {
                      setPersons(persons.concat(savePersonInfo));
                      setNewName('');
                      setNewNumber('');
                    });
      
    }
1
  • Perfecto compa muchas gracias, funciona como requería, muchas gracias. Saludos. el 18 jun. 2021 a las 16:25

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.