关于react.js:React-事件和-Dom-事件的区别

function App() {
  const onClickButton = (event) => {
        console.log('合成事件:', e)
    console.log('currentTarget:', e.currentTarget)
    console.log('target:', e.target)
    console.log('原生事件:', e.nativeEvent)
    console.log('currentTarget:', e.nativeEvent.currentTarget)
    console.log('target:', e.nativeEvent.target)
  }
  return (
    <div className="App">
      <button onClick={onClickButton}>点我</button>
    </div>
  );
}

这外面的 event 不是原生事件,而是合成事件 SyntheticEvent

原生事件要应用 event.nativeEvent

原生事件是被挂在到 document 上的,所以 currentTarget 获取到的是 document

尽管 SyntheticEventreact 模仿的,但 Dom 具备的能力,它都有,只是这些能力不受 Dom 管制。比方:阻止默认行为 preventDefault ,阻止冒泡 stopPropagation

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理