: 사건!

<button onclick="activate">
	Activate
</button>
<button onClick={activate}>
	Activate
</button>

Event Handler(Event Listener)

: 어떤 사건이 발생하면, 사건을 처리하는 역할

function Toggle(props) {
	const [isToggleOn, setIsToggleOn] = useState(true);
	
	// 방법1. 함수 안에 함수로 정의
	function handleClick() {
		setIsToggleOn((isToggleOn) => !isToggleOn);
	}

	// 방법2. arrow function을 사용하여 정의
	const handleClick = () => {
		setIsToggleOn((isToggleOn) => !isToggleOn);
	}

	return (
		<button onClick={handleClick}>
			{isToggleOn ? '켜짐' : '꺼짐'}
		</button>
	)
}

Arguments

: 함수에 전달할 데이터

Parameter

: 매개변수

function MyButton(props) {
	const handleDelete = (id, event) => {
		console.log(id, event.target);
	}
	
	return (
		<button onClick={(event) => handleDelete(1,event)}>
			삭제하기
		</button>
	)
}