[React] #5 이벤트 핸들링

사용자가 웹 브라우저에서 DOM 요소들과 상호 작용하는 것을 이벤트(event)라고 한다. 예를 들어 버튼에 마우스 커서를 올릴 때 발생하는 onmouseover 이벤트, 클릭할 때 발생하는 onclick 이벤트 등을 말한다.

 

이벤트 사용할 때 주의 사항

1. 이벤트 이름은 카멜 케이스 형태로 작성한다.2. 이벤트에 자바스크립트 코드가 아닌 함수 형태의 객체를 전달한다.3. DOM 요소에만 이벤트를 설정할 수 있다. (직접 만든 컴포넌트에 이벤트를 자체적으로 설정할 수 없다.)

 

onChange={
  (e) => {
    console.log(e.target.value);
  }
}

* e 객체는 SyntheticEvent로 웹 브라우저의 네이티브 이벤트를 감싸는 객체이다. 

 

 

참고 자료 : https://thebook.io/080203/, https://react.vlpt.us