[React] 6. 이벤트

less than 1 minute read

Published:

이벤트

onClick

  • onClick={function(event)}{ event.preventDefault(); }

함수 호출

props.함수명();

파라미터

함수가 값을 받을 수 있도록 만들어 둔 자리 이름 (함수 안으로 들어오는 값을 담는 변수)

function sayHello(name) { console.log(name + "님 안녕하세요!"); }

=> 여기서 name이 파라미터 => sayHello(“예람”); 이라고 출력값을 넣어주면 name에 예람이 들어감

event

사용자가 화면에서 뭔가 했을 때 React가 알아차리는 신호

```function Button() { function handleClick() { alert(“버튼을 클릭했어요!”); }

return ( <button onClick={handleClick}> 클릭 </button> ); } -> 기본 예시 ` onClick은 “클릭 이벤트가 발생하면”이라는 뜻 handleClick은 “그때 실행할 함수”

```function InputBox() { function handleChange(event) { console.log(event.target.value); }

return <input onChange={handleChange} />; }```

event.target.value는 사용자가 input에 입력한 값