什么是事件池反应？

Question

SyntheticEvent已合并。这意味着在调用事件回调之后，将重新使用SyntheticEvent对象，并且所有属性都将无效。这是出于性能原因。因此，您不能以异步方式访问事件。

参考：React中的事件系统

Answer 1

这意味着事件的属性仅在回调处于活动状态时存在。将异步添加到混音或存储事件以供将来使用将失败。

如果console.log(event)在事件处理程序中尝试，则很容易观察到。在您检查对象时，事件对象的大多数属性将为null。如果debugger;在记录该值后立即停止执行脚本，则可以检查这些值。

class MyComponent extends React.Component {
    handleClick (e){
    console.log('The event currentTarget is', e.currentTarget); // DOM element
    setTimeout(() => {
    console.log('event.currentTarget was', e.currentTarget); // null
  }, 1000)
  }
  render () {
    return <button onClick={this.handleClick}>Fire event!</button>
  }
}

当您单击按钮时，这将记录一个DOM元素，然后再记录null一秒。由于我以外的原因，event.target它会一直存储到下一个事件发生为止，并且不会无效。