我一直在网上搜索我的问题的答案,但没有成功。我正在尝试向我的按钮添加一个简单的 react 点击处理程序,但我似乎无法让它工作。这可能是非常简单的事情,我只是无法理解它。
这是我的代码:
export default class ReviewBox extends Component {
deleteReview() {
console.log("hey");
}
render() {
const {reviews, date, lectureId} = this.props;
const that = this;
return (
<div className="container content-sm">
<div className="headline"><h2>Reviews</h2> <span>{date}</span></div>
<div className="row margin-bottom-20">
{reviews.map(review => {
return(
<div className="col-md-3 col-sm-6">
<div className="thumbnails thumbnail-style thumbnail-kenburn">
<div className="caption">
<h3>{review.comment}</h3> <br />
<button className="btn btn-danger" onClick={this.deleteReview()}>Delete</button>
</div>
</div>
</div>
)
})}
</div>
<hr />
<AddReview lectureId={lectureId} />
</div>
)
}
}
当我单击按钮时,它拒绝触发该功能。我试过 .bind(this) 和 onClick={() => this.deleteReview} 等。
所有帮助表示赞赏!
最佳答案
我认为您在箭头函数中缺少大括号 ()
<button className="btn btn-danger" onClick={() => this.deleteReview()}>Delete</button>
关于javascript - 在 map 函数中 react onClick 处理程序,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/40739877/