Javascript 取消React子组件中父组件的onClick事件

我有一个组件，看起来像：

<ParentComponent onClick={this.doSomething}>
  <ChildComponent onClick={this.doSomethingElse} />
</Parent>

---

如果我单击ChildComponent，doSomethingElse和doSomething都会起火。当子onClick事件触发时，如何取消父组件onClick事件传播？

您应该添加行

e.stopPropagation（）

到

this.doSomethingElse

事件处理程序的顶部

防止当前事件在捕获和冒泡阶段进一步传播

因此，当您在事件处理程序中使用

e.StopPropagation（）

时，它可以防止事件冒泡到祖先并触发他们的事件处理程序

确保将

e

作为

this.doSomethingElse

方法的参数

doSomethingElse( e ) {
  e.stopPropagation();
  // ... do stuff
}

---

如果希望避免重复事件，请使用

stopPropagation

功能

类应用程序扩展了React.Component{
firstHandle=（）=>{
console.log（'parent'）；
}
secondHandle=（e）=>{
e、 停止传播（）；
console.log（'child'）；
}
render（）{
返回(
父母亲
小孩
);
}
}
ReactDOM.render(
,
document.getElementById（“react”）
);
可能会重复“不”，甚至一点也不。