Javascript 如何将事件冒泡到最顶级的父级反应样式？

我有一套组件

app->page->list\u container->list->item

我的目标是通知

应用程序

在

项目

级别上发生了单击。 如果存在类似于

父->子-

的简单关系，我可以使用props并执行类似于：

…

的操作，然后使用

this.props.onClick（）

进行回调。

---

但是，对于使用组件树执行相同的操作，最好的原生React样式收据是什么？如何通知

应用程序

，即单击了

项

，而没有调用Flux/Reflux、Elm和其他支持的LIB？

标准反应方式：
传递

onClick

函数作为组件树的支撑是执行此操作的标准方法

在

中：

<list_container onClick={this.props.onClick}>

在

组件中，为该项提供一个（唯一的）id

我一般不建议这样做：

• 在典型的反应树设置中，较低级别的组件（如
  ）可能会被多次渲染，然后您需要 确保每个ID唯一的附加逻辑
• 你也会 需要添加一些额外的smarts，以确保在以下情况下删除侦听器： 将从DOM中删除有问题的项

---

谢谢。但不知何故，我确信向根组件冒泡一个事件或状态是一项常见的任务。我真的很奇怪，它有一个如此乏味的解决方案。也许我构建代码的方式有问题？有没有什么常见的反应方式可以做到这一点？唯一常见的反应方式就是冒泡。但是React不喜欢冒泡（也称为反模式）。混合使用父子通信和父子通信会使代码更难调试。这就是为什么具有单向数据流的流量经常与react携手并进。

<list_container onClick={this.props.onClick}>

<list_container {...this.props}>

componentDidMount: function() {
  var itemElementInDOM = document.getElementById('myItem');
  itemElementInDOM.addEventListener('click',this._onClick);
}