Javascript 如何防止用户添加已经存在的名称？

handleSubmit（）函数是我阻止用户添加现有用户的地方，但它不起作用。如果添加的姓名存在于人员列表中，则应弹出警报

编辑：链接到我的代码

import React，{useState}来自“React”；
从“uuid”导入{v4 as uuidv4}；
const PersonForm=（{addPerson，persons}）=>{
const[info，setInfo]=useState({
姓名：“，
编号：“，
id:“”，
});
常量handleInputChange=（事件）=>{
setInfo（{…info，[event.target.name]：event.target.value}）；
};
const handleSubmit=（事件）=>{
const form=event.target；
event.preventDefault（）；
if（event.target.name==persons.map（（person）=>person.name））{
警报（“名称存在”）；
}
addPerson({
…信息，
id:uuidv4（），
});
setInfo（{…info，名称：，编号：}）；
form.reset（）；
};
返回(
姓名：


编号：
添加
);
};
导出默认人形；

您需要确定您的用户是否存在于阵列中

    const form = event.target;
    event.preventDefault();
    if (persons.some((person) => person.name === event.target.name)) {
      alert("Name exist");
      return
    }
    addPerson({
      ...info,
      id: uuidv4(),
    });
    setInfo({ ...info, name: "", number: "" });
    form.reset();
  };```

---

您需要确定您的用户是否存在于阵列中

    const form = event.target;
    event.preventDefault();
    if (persons.some((person) => person.name === event.target.name)) {
      alert("Name exist");
      return
    }
    addPerson({
      ...info,
      id: uuidv4(),
    });
    setInfo({ ...info, name: "", number: "" });
    form.reset();
  };```

---

好的，感谢您指出将数组与单个名称进行比较的错误

这很有效

const handleSubmit = (event) => {
    const form = event.target;
    event.preventDefault();
    if (persons.map((person) => person.name === info.name).length > 0) {
      alert("Name exist");
      form.reset();
      return;
    }
    addPerson({
      ...info,
      id: uuidv4(),
    });
    setInfo({ name: "", number: "" });
    form.reset();
  };

---

好的，感谢您指出将数组与单个名称进行比较的错误

这很有效

const handleSubmit = (event) => {
    const form = event.target;
    event.preventDefault();
    if (persons.map((person) => person.name === info.name).length > 0) {
      alert("Name exist");
      form.reset();
      return;
    }
    addPerson({
      ...info,
      id: uuidv4(),
    });
    setInfo({ name: "", number: "" });
    form.reset();
  };

---

不返回单个值…是否返回人名的新数组？是的。因此，不能将数组与单个名称进行比较。您需要单独检查每个名称。不返回单个值…是否返回人名的新数组？是的。因此，不能将数组与单个名称进行比较。您需要单独检查每个姓名。是否这样做，但没有弹出警报，并在先前添加的其他联系人下方返回一个没有任何姓名或号码的删除按钮。是否这样做，但没有弹出警报，并在先前添加的其他联系人下方返回一个没有任何姓名或号码的删除按钮。