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

39次阅读

共计 559 个字符，预计需要花费 2 分钟才能阅读完成。

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

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

正文完