Backend
home
🎫

27, 28. Event의 정의 및 Event 다루기 + (실습) 클릭 이벤트 처리하기

생성일
2025/01/24 05:52
태그

Event

사건을 의미 (특정 사건을 의미)
사용자가 버튼을 클릭한 사건 → 버튼 클릭 이벤트
이벤트 처리 → 이벤트 핸들링

Event Handler (= Event Listener)

어떤 사건이 발생하면, 사건을 처리하는 역할
Event Listener
성능 문제 → 바인딩 고려
함수 컴포넌트에서의 처리

Argument

함수에 주장할 내용
함수에 전달할 데이터 (EventHandler에 전달할 데이터)
매개변수
예제 코드

클릭 이벤트 처리하기

import React, { useState } from "react"; function ConfirmButton(props) { const [isConfirmed, setIsConfirmed] = useState(false); const handleConfirm = () => { setIsConfirmed((prevIsConfirmed) => !prevIsConfirmed); }; return ( <button onClick={handleConfirm} disabled={isConfirmed}> {isConfirmed ? "확인됨" : "확인하기"} </button> ) } export default ConfirmButton;
Java
복사