리액트 이벤트 연결하기

function App() {
  const handleClick = (event) => {
    console.log(event);
    alert('click!');
  };
  return (
    <>
      <button onClick={handleClick}>버튼</button>
    </>
  );
}

export default App;

• 태그 안에 이벤트 속성 작성
  • onClick, onSubmit, onChange ...
• 속성 값으로 자바스크립트 함수를 작성해 이벤트를 연결함
• 이벤트 발생 시 SyntheticBaseEvent 객체가 리스너에 전달됨
  • 리액트가 한 단계 감싼 이벤트 객체
  • 자바스크립트로 처리하는 이벤트와 동일한 데이터들이 들어있음
   

 

참고

https://reactjs.org/docs/handling-events.html

Handling Events – React