如何解决如何在 ReactJs 中处理按钮数组处理单击事件
我的 react 类组件就是这样尝试的。但是一旦它呈现警报弹出窗口就会一直出现而无需单击任何按钮。
onHandleOnClick(data,e) {
console.log(data);
alert("got it" + data);
}
renderRating(){
var arr = [0,1,2,3,4,5,6,7,8,9,10];
return arr.map((val) => {
return (
<button
onClick={this.onHandleOnClick(val)}
>
{val}
</button>
);
});
};
render() {
return (
<div>
{this.renderRating()}
</div>
)
}
我是 React 新手。我该怎么做?
解决方法
您正在调用该函数,而不是将其分配给 onClick 事件。
由于需要向回调传递参数,因此可以将匿名函数传递给 onClick
。请注意,要同时捕获 React 隐式传递的 event
,您应该将其作为匿名函数中的参数传递。
onClick={(e) => this.onHandleOnClick(val,e)}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。