[React] 이벤트 전달, onClick={} 에서 함수에 () 붙고 안 붙고 차이

 

 

 

이벤트 전달 in React.js

이벤트를 전달할 때 주의점

= return문 안에서 태그에 onClick={} 에서 함수에 () 붙고 안 붙고 차이

 

1. DOM 요소에만 이벤트 설정이 가능.

직접만든 컴포넌트에는 이벤트를 자체적으로 설정할 수 없다.
<MyComponent onClick={doSth}/>
이 예제는 doSth 함수를 실행하는 것이 아닌 이름이 onClick인 props를 MyComponent에게 전달해줄 뿐이다.

 

2. 함수 형태의 값을 전달

html에서는 "" 안에 실행할 자바스크립트 코드를 넣었지만, 리액트에서는 함수 형태의 객체를 전달한다
따라서 onClick={doSth} 혹은 onClick={()=>alert('실행')}