反应合成事件奇怪的行为答案

【问题标题】：React Synthetic Event strange behavior反应合成事件奇怪的行为
【发布时间】：2018-12-06 01:15:28
【问题描述】：

我搜索了其他答案，this one 最接近我正在处理的问题。

但我的问题仍然存在。我无法访问合成事件的属性。赞shiftKey

我认为只是这个库引起了问题。但是在单击处理程序中，我可以将事件打印到控制台，并且可以看到 shiftKey 参数已按预期设置。但是每次我尝试访问event.shiftKey 时都会收到错误消息：

index.js:1452 警告：出于性能原因，此合成事件被重用。如果您看到这一点，则表示您正在访问已发布/无效合成事件的属性 `shiftKey`。这设置为空。如果您必须保留原始合成事件，请使用 event.persist()。

查看我的代码示例。

【问题讨论】：

我刚刚尝试在我的机器上重现此错误，但没有收到您遇到的错误。您是否还有其他可能未在此处显示的内容？
感谢您的尝试，我真的希望我能提供更多，这就是让这变得如此混乱的原因。以上似乎对每个人都有效。我将使用我正在使用的 d3 包制作一个准系统 git repo，并确保它可以在那里复制，然后在此处更新帖子。
@ChaimFriedman 看看：github.com/mwilde345/reactBrokenClick
代码与您最初发布的不同。问题出在第三方组件 github.com/bkrem/react-d3-tree/blob/master/src/Tree/… 中。事件对象在那里异步使用。 persist() 应该在那里调用，而不是在你自己的组件中。
@estus 感谢您深入研究。我看到该方法被用作包含的 onClick 方法：github.com/bkrem/react-d3-tree/blob/master/src/Tree/…。因此，每次单击节点时实际上都会进行两次 onClick 调用。我用新的回购代码更新了我原来的问题。明天我会根据您的建议进行更改，并确保它有效。如果是这样，我认为值得您发布答案。我可以将它用于该库的 PR。

【解决方案1】：

不应依赖对象在控制台中出现的方式。对象在 JavaScript 中通过引用传递。如果对象内部在某个时候更新，它们将在控制台中更新。

persist() 创建事件对象的副本，因此它应该在控制台中作为快照出现在它被调用的那一刻。 persist() 出现问题意味着它出了问题。

问题是由第三方组件Tree from react-d3-tree引起的。事件对象是异步使用的，用户代码中的persist()不会有理想的结果，而是应该在Tree组件中同步调用persist()。

【讨论】：