javascript - 使用数组中的按钮传递值

我正在学习使用React，但我对如何使用按钮传递id有问题。

我已从以下位置恢复数据以供提取：https://jsonplaceholder.typicode.com/users

我的js页面：

handleClick(){
    alert("ALERT " + this.props);
}


render(){
    const listMeetings = this.props.meetings.map((meeting) =>
    <li key={meeting.id}>{meeting.name}
    <button key={meeting.id} onClick={() => this.handleClick(meeting.id)} value={meeting.id}>{'Details'}</button>
    </li>);
    return(
        <div>
                   <ul>{listMeetings}</ul>
        </div>
    )
}
}

因此，目前我在每个名称旁边都有一个名称列表和一个按钮。
我要做的是在单击按钮时传递每个名称​​的ID（此刻，我仅会打印带有ID的警报。

通过我的代码，我了解到我传递了所有数组（因此我有10个对象）。

我能怎么做？谢谢。

最佳答案

您在handleClick中存在错误，将meeting.id作为参数传递，但在函数声明中丢失

handleClick(id){
  alert("ALERT " + id);
}


render(){
  const listMeetings = this.props.meetings.map((meeting) =>
    <li key={meeting.id}>{meeting.name}
      <button key={meeting.id} onClick={() => this.handleClick(meeting.id)} value={meeting.id}>{'Details'}</button>
    </li>);
  return(
    <div>
      <ul>{listMeetings}</ul>
    </div>
  )
}
}