javascript - 将额外的道具传递给 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}"。还有其他方法可以实现吗？

标签： javascriptreactjsjsx

Answer 1

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

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

然后：

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