将其他道具传递给Div-React

Question

我想知道是否有任何方法可以将其他道具发送到div标签以做出反应？我正在尝试创建自定义单选按钮，并希望添加另一个道具来表示特定单选按钮正在处理的数据类型。

这是我的JSX：

<div className="selection" value={this.state.event.name} onClick={(item) => this.selectedChoice(item, "yes")}></div><p>Yes</p>

但是当我跑步时：

selectedChoice(selected, response) {
    console.log(selected.target.value)        
}

控制台将输出undefined而不是事件名称，该名称已经定义并且可以在其他地方显示。据我了解，value并不是div标签的道具，因此这就是它显示undefined的原因。我考虑过将this.state.event.name作为一个类，但是似乎我不能做类似className="selection {this.state.event.name}"的事情。我还有其他方法可以实现这一目标吗？

Answer 1

您可以添加一个data-道具：

<div data-value={this.state.event.name}>

然后：

console.log(selected.target.getAttribute("data-value"));