Javascript 我如何在React中获取此id？

我试图让React从一个按钮组件中获取id，这些组件从dialog.json文件映射而来。在浏览器中检查时，id正确位于按钮标记中。但我不知道如何抓住它一次

（在点击抓取id后，它将从下一个dialog.json更新状态并显示文本和按钮）

import React，{Component}来自'React'；
从“../../utils/API”导入API；
导入“/style.css”；
从“./dialog.json”导入对话框；
从“../../components/Button”导入按钮；
从“../../components/Text”导入文本；
类游戏扩展组件{
状态={
用户ID:，//已登录的用户
currentLine:对话框[0]
}
handleClick=（）=>{
警报（'您的下一行是：'+this.id）；
console.log（对话框[0]）；
这是我的国家({
currentLine:对话框[this.id]
})
}
componentDidMount（）{
API.getMyDude（this.props.username）。然后（myDude=>{
这是我的国家({
userID:myDude
})
})
//这个；
}
render（）{
返回(




{/*{console.log（textNodes[0]）}*/}




{this.state.currentLine.options.map（option=>(
//console.log（option.nextText），
<按钮
option={option.text}
id={option.nextText}
handleClick={this.handleClick}
/>
))}
)
}
}
导出默认游戏

---

此外，任何其他提示或技巧都将受到欢迎

您需要将单击事件传递给handleClick函数

handleClick = (event) => {
    alert('Your next Line is: ' + event.target.id);
    console.log(dialog[0]);
    this.setState({
        currentLine: dialog[event.target.id]
    })
}

---

您可以尝试将

“{option.nextest}”

作为参数传递给

handleClick

函数

您可以在按钮组件中获取id。事实上，您可以在方法稍作更改后将handleClick作为道具（处理程序）传递给Button：

handleClick = (event) => {
    alert('Your next Line is: ' + event.target.id);
    console.log(dialog[0]);
    this.setState({
        currentLine: dialog[event.target.id]
    })
}

    handleClick = id => {
        alert('Your next Line is: ' + id);
        console.log(dialog[0]);
        this.setState({
            currentLine: dialog[id]
        })
    }

在按钮组件中，应将id（props）作为参数传递给处理程序（props），如下所示：

onClick = {()=>props.handler(props.id)}