React.js 기본 사용법(4) - 이벤트 처리

이번 포스트에서는 간단하게 이벤트 처리에 대해 알아본다.

 

function Form() {
  function handleSubmit(e) {
    e.preventDefault();
    console.log('You clicked submit.');
  }

  return (
    <form onSubmit={handleSubmit}> // 기존 HTML이었다면 onSubmit="handleSubmit(e)"
      <button type="submit">Submit</button>
    </form>
  );
}

 

이벤트를 선언할 때 중괄호에 함수를 넣어주기만 하면 된다.

 

---

다음 포스트에서는 조건부 렌더링에 대해 알아본다.