[React]이벤트 버블링, 이벤트 위임

react children element click parent element
이벤트 버블링, 이벤트 위임 내용 정리

stackoverflow 답변

if(e.currentTarget != e.target ) return;

event.stopPropagation()

stopPropagation() 웹 API

function logEvent(event) {
event.stopPropagation();
}
if(event.target == event.currentTarget){
event.stopPropagation()
....
}

이벤트 위임 - Event Delegation

이벤트 위임을 한 문장으로 요약해보면 ‘하위 요소에 각각 이벤트를 붙이지 않고 상위 요소에서 하위 요소의 이벤트들을 제어하는 방식’입니다.

🐔참고문헌

Stackoverflow(react children element click parent element 구글링결과)

https://stackoverflow.com/questions/37568550/react-prevent-event-trigger-on-parent-from-child

github.io

https://joshua1988.github.io/web-development/javascript/event-propagation-delegation/

javascript.info

https://ko.javascript.info/bubbling-and-capturing