더북(TheBook)

5. 이벤트

① 이벤트는 사용자와의 상호작용을 의미하며, 리액트에서도 이벤트를 통해 상호작용 기능을 구현할 수 있습니다.

② JSX에서 이벤트를 사용하려면 JSX 요소에 이벤트 속성을 부여하고, 해당 이벤트 핸들러를 연결합니다.

형식

<JSXElement 이벤트_속성={이벤트_핸들러}/>

③ 이벤트 속성은 JSX 요소에서 이벤트를 처리하기 위해 사용하는 속성으로, 카멜 케이스로 작성합니다.

④ 이벤트 핸들러는 이벤트 발생 시 실행할 함수를 의미합니다.

인라인 핸들러: JSX 요소 안에서 직접 함수를 작성해 할당, 매개변수가 필요한 경우에는 반드시 인라인 핸들러 방식 사용

함수 참조: 외부에서 정의한 함수를 JSX 요소에서 참조

 

⑤ 이벤트 객체: 리액트는 기본 DOM 이벤트를 감싸 합성 이벤트로 제공합니다. 이는 웹 브라우저 간 동작 차이를 줄이기 위한 것으로, 크로스브라우저 호환성을 보장합니다.

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.