
그림 3-19 캡처링 결과
● 버블링
버블링(bubbling)은 이벤트가 자식 요소에서 시작해 부모 요소로 전파되는 방식입니다. 예를 들어, <button> 요소에서 발생한 클릭 이벤트는 해당 버튼을 포함한 <div>, <body>, <html> 요소로 차례대로 전달됩니다.
리액트에서는 버블링이 기본 동작이므로 캡처링처럼 Capture 수식어가 붙은 별도의 이벤트 속성이 필요하지 않습니다. 이벤트 속성 이름을 그대로 사용하면 됩니다.
다음 코드는 앞서 살펴본 캡처링 예제와 구조는 거의 같고, 이벤트 속성에 Capture 수식어만 없습니다.