javascript - ReactErrorUtils.invokeGuardedCallback 中的 React 在 IE 浏览器中重复触发事件

Question

我在我的应用程序中使用 react 和 highchart。目前 React 面临一个奇怪的问题。我有一个菜单项，在它的点击事件上它做了一些处理(假设将图表导出为图像)。所以目前我观察到它在我的 react 组件中的任何 setState 操作上被触发。当我查看调用堆栈时，我发现 ReactErrorUtils.invokeGuardedCallback 一直在重复发送此事件。

有没有人遇到类似的 react 组件问题，即在任何 setState 操作上都会触发点击

Answer 1

已经有一段时间了，但当我在嵌套组件中附加了相同类型的 eventListener 时，我总是遇到这样的问题。例如，带有 onClick 属性的外部组件和带有另一个 onClick 属性的内部元素。

如果点击内部元素，事件会向上冒泡到外部元素，并且也会调用外部元素的 onClick 回调。在堆栈跟踪中，您现在看到它是由 invokeGuardedCallback

调用的

要阻止事件冒泡，调用

event.stopPropagation();

在内部元素的回调函数中。

可能还有其他情况 ivokeGuardedCallback 可以调用回调 - 以确保您始终可以阅读代码。