React：获取元素并在渲染后应用onClick

Question

我正在使用使用jquery的bootstrap主题做出反应。

问题是bootstraps下拉菜单和onClick的反应不能一起工作。

我的解决方案是我在组件的componentDidUpdate（）方法中使用jQuery应用onClick处理程序。这可以按预期工作。

这不起作用：

 <ul className="dropdown-menu pull-right">
     <li id="logout-button">
         <a href="#" onClick={this.logout.bind(this)}><i></i> Logout</a>
     </li>
 </ul>

这有效：

public componentDidUpdate() {
  // workaround: problems with bootstraps dropdown onclick event
  $('#logout-button').click(() => {
      this.logout();
      return false;
  });
}

但我怎么能在纯粹的反应中做到这一点？

如何在react中检索我的dom元素并在渲染后应用onClick侦听器？

Answer 1

使用React's refs，您可以获得对Component内部DOM元素的引用。

在componentDidMount中绑定事件时，请记住在componentWillUnmount中删除外部侦听器。