[英]React | Virtual DOM element click event not triggering
I'm using Ant Design and React js for my Project. 我正在为我的项目使用Ant Design和React js 。
Problem 问题
I have a button in Popover and having click event for that button. 我在Popover中有一个按钮,并且具有该按钮的click事件。 The problem is button click event is not triggering.
问题是按钮单击事件未触发。
JS Code JS代码
const content = (
<div className="RecurringPopover">
<button onClick={this.handleClick}> Popover Button </button>
</div>
);
Full Code with scenario in stackblitz 完整的代码在场景 stackblitz
You have defined content
outside the class and then supplying this.handleClick
as a click handler to it. 您已经在类之外定义了
content
,然后提供this.handleClick
作为单击处理程序。 However outside class, this
does not point to the class
. 但是,在课堂之外,
this
并不指向该class
。 You should define content
inside class
and use this.content
to access that. 您应该在
class
内部定义content
,并使用this.content
进行访问。
handleClick() {
alert('test');
}
// put it inside class
content = (
<div className="RecurringPopover">
<button onClick={this.handleClick}> Popover Button </button>
</div>
);
render() {
return (
<div>
<Row>
<Col span={12}>
// Use this.content instead of just content
<Popover content={this.content} title="Title">
<span type="primary">Hover me (Popover Button)</span>
只需将“ content
”带入类内部,然后通过“ this.content
”将其传递给组件,它将起作用。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.