反应合成事件奇怪行为

Question

我已经搜索了其他的答案，这一个是我所面对的最接近的。

但我的问题依然存在。我无法访问合成事件的属性。就像shiftKey

对于某些上下文，我使用了一个onClick处理程序，它附带了react d3树库。

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

index.js:1452警告:出于性能原因，将重用此合成事件。如果您看到这一点，您将在一个已释放/无效的合成事件上访问属性shiftKey。此值设置为空。如果必须保留原始合成事件，请使用event.persist()。

看我的代码样本。

更新:回购以复制问题https://github.com/mwilde345/reactBrokenClick

Answer 1

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

persist()创建事件对象的副本，因此在调用事件对象时它应该以快照的形式出现在控制台中。persist()出现的问题意味着它出了问题。

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