4전 4전

리엑트에서 onScroll 이벤트를 제외한 모든 이벤트들은 부모 컴포넌트의 자식 컴포넌트에서 발생한 이벤트가 부모컴포넌트로 전파가 됩니다. 이를 "bubbles", "propagates"라고 합니다. | 예시 import React from 'react'; import './style.css'; export default function App() { return ( { console.log('1'); }} > console.log('2')}>children ); } 이런 식으로 부모요소를 클릭하면 콘솔에 1이 출력되고, 자식 요소인 버튼을 클릭하면 콘솔에 2가 출력되도록 해 보겠습니다. 그럼 이런 식으로 부모를 클릭했을 때 1이 출력되고, 자식 버튼을 클릭하면 버블링 현상으로 2와 1이 같이 출력이 됩..

| 이벤트 핸들러 리액트에서 이벤트핸들러를 JSX에 추가할 수 있습니다. 이벤트 핸들러는 클릭, 마우스 호버링, 폼 입력 등과 같은 상호작용에 따라 동작하도록 하는 기능입니다. export default function Button() { function handleClick() { console.log('클릭됨'); } return ( 클릭 ); } 이런 식으로 먼저 동작에 대한 함수를 정의해 준 다음 에 onClick={handleClick}를 추가해 주면 됩니다. 보통 함수 이름은 "handle"로 시작하고 뒤에 사용하는 이벤트를 적어준다고 합니다. onClick={handleClick}, onMouseEnter={handleMouseEnter} 이런 식으로 하면 됩니다. 또한 JSX에서 이벤트 핸..