javascript - 如何在React js中找出带有键的数组元素

Question

我正在制作下图中的东西:

我编写了以下代码:

{ persons.map((person) => <li key = {person.id}> 
  <Person name={person.name} number={person.number}/> 
  <Button text={'Delete'} handler={deleteHandler} /> 
</li>) }

我面临的问题是，如何使按钮(deleteHandler)起作用并删除与其关联的联系人？

我认为应该做的 -> 找出与按钮关联的键(

中的键)并将其从数组中删除。 但是我如何找到与按钮关联的

键呢？

注意 - 我正在使用 React hooks 进行状态更改(而不是类)，因此，请相应地建议答案。

谢谢

Answer 1

{ persons.map((person) => <li key = {person.id}> 
  <Person name={person.name} number={person.number}/> 
  <Button text={'Delete'} handler={() => deleteHandler(person.id)} /> 
</li>) }

在处理程序中，您可以使用 person.id 过滤数组