为什么我可以访问和使用 event.currentTarget 但当我打印事件时

Question

考虑 React 中的以下代码：

// rendered:

<input type="file" onChange={onFileSelected} />

// Event handler:

function onFileSelected(event: ChangeEvent<HTMLInputElement>) {

  console.log('event:');

  console.log(event);

  console.log('event.currentTarget.files:');

  console.log(event.currentTarget.files);

}

现在，在触发我的函数上选择文件后onFileSelected，这是输出：

https://i.stack.imgur.com/sMriZ.png

我在屏幕截图中标记了我的困惑：event.currentTarget为空，但event.currentTarget.files可以访问？这怎么可能？

Answer 1

摘自Event.currentTarget 文档注意：event.currentTarget 的值仅在处理事件时可用。如果您使用 console.log() 事件对象，将其存储在变量中，然后在控制台中查找 currentTarget 键，则其值将为 null。相反，您可以直接 console.log(event.currentTarget) 以便能够在控制台中查看它，或者使用调试器语句，这将暂停代码的执行，从而显示 event.currentTarget 的值。