React复选框onCheck获取键值
React复选框onCheck获取键值
提问于 2018-02-12 19:11:48
我目前正在使用React构建一个网站，并且我无法从onChange事件中获得复选框键值。这就是我的代码的样子：
handleChange = (e) => {
console.log('it works');
console.log(e.target.key);
}我的复选框代码：
<Table.Cell><Checkbox key={singleNews.key} name="myCheckBox1" onChange={this.handleChange}/></Table.Cell>它只需打印出“它有效”和“未定义”。我还在构造函数中使用了'this.handleChange = this.handleChange.bind( this )。有人能帮我找出错误可能是什么吗?为了记录在案；我目前正在使用语义UI反应框架--这会是问题吗？
提前谢谢。
回答 2
Stack Overflow用户
回答已采纳
发布于 2018-02-12 19:26:35
首先，react中的关键属性是一个特殊的支柱，不应该是被您的应用程序访问，并被视为内部响应。。
如果您不尝试将键用于任何事情，而只是尝试从这个问题线程获取更新的数据，那么应该可以访问事件处理程序中的值，如下所示：
handleChange = (e, data) => {
console.log('it works');
console.log(data.value);
}如果您想根据运行时收到的数据将数据传递到事件处理程序中，那么您可以做的是将复选框代码更改为：
<Table.Cell>
<Checkbox name="myCheckBox1" onChange={(e, data) => this.handleChange(singleNews.key, data.value)}/>
</Table.Cell>以及您的更改处理程序
handleChange = (key, value) => {
console.log('here\'s the key', key);
console.log('and the value', value);
}Stack Overflow用户
发布于 2018-02-12 19:25:07
根据semantic-ui-react (这是根据标记使用的库，对吗？)得到两个参数：event和data。
data是：
所有道具和建议的检查/不确定状态。
因此，您的代码应该如下所示：
handleChange = (e, data) => {
console.log('it works');
console.log(data); // the data / props that passed to the component
}请注意，key是为react保留的，不会传递回处理程序。
不过，您可以使用任何其他prop。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/48753802
复制相关文章
相似问题
腾讯云开发者
