Javascript 使用数组中的按钮传递值

我正在学习使用React，我有一个关于如何使用按钮传递id的问题

我已从以下位置恢复用于提取的数据：

我的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>
    )
}
}

handleClick（）{
警报（“警报”+这个道具）；
}
render（）{
const list meetings=this.props.meetings.map（（会议）=>
{meeting.name}
this.handleClick（meeting.id）}value={meeting.id}>{'Details'}
）；
返回(
{listMeetings}
)
}
}

所以现在我有一个名字列表和一个按钮，紧挨着每个名字。 我要做的是在点击按钮时传递每个名字的id（此时我只打印带有id的警报）

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

---

我该怎么办？谢谢。

改用匿名函数版本：

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

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

handleClick=（id）{
警报（“警报”+id）；
}
render（）{
const list meetings=this.props.meetings.map（（会议）=>
{meeting.name}
this.handleClick（meeting.id）}value={meeting.id}>{'Details'}
）；
返回(
{listMeetings}
)
}

改用匿名函数版本：

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

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

handleClick=（id）{
警报（“警报”+id）；
}
render（）{
const list meetings=this.props.meetings.map（（会议）=>
{meeting.name}
this.handleClick（meeting.id）}value={meeting.id}>{'Details'}
）；
返回(
{listMeetings}
)
}

您的

handleClick中有一个错误

您将

meeting.id

作为参数传递，但它在函数声明中丢失

handleClick（id）{
警报（“警报”+id）；
}
render（）{
const list meetings=this.props.meetings.map（（会议）=>
{meeting.name}
this.handleClick（meeting.id）}value={meeting.id}>{'Details'}
）；
返回(
{listMeetings}
)
}
}

您的

handleClick中有一个错误

您将

meeting.id

作为参数传递，但它在函数声明中丢失

handleClick（id）{
警报（“警报”+id）；
}
render（）{
const list meetings=this.props.meetings.map（（会议）=>
{meeting.name}
this.handleClick（meeting.id）}value={meeting.id}>{'Details'}
）；
返回(
{listMeetings}
)
}
}

@Jack23所有人都会这样，不要worry@Jack23所有人都会这样，别担心