在reactJs中settimeout函数内的事件数据为空

Question

我有一个反应功能

<button onClick={(e) => this.playVideo(e, name)}>

尝试了两种选择

playVideo(event, name) {
    console.log(event, 'event details');
    setTimeout(function () {
      console.log(event, 'event details inside timeout'); 
    }, 1500)
}

playVideo(event, name) {
    console.log(event, 'event details');
    setTimeout(function (event) {
      console.log(event, 'event details inside timeout'); 
    }, 1500)
}

在上面的代码中，初始事件按预期工作，但我需要 settimout 中的事件数据，因为我必须根据事件加载一些 js 文件，但 settimeout 函数中的事件数据始终为空。

我也尝试过onClickCapture但仍然没有运气

<button onClickCapture={(e) => this.playVideo(e, name)}>

Answer 1

由于React 中使用了Syntethic EventReact-v17包装器，因此您需要将值置于范围内之前：

playVideo(event) => {
    const { currentTarget } = event;

    // closure on currentTarget won't lose due to synthetic event.
    setTimeout(() => {
      console.log(currentTarget, 'event details inside timeout'); 
    }, 1500)
}