[React.js] Kossie Coder - 3강. 이벤트 핸들링 (onClick & onKeyUp)

1. onClick

클릭 시 발생하는 이벤트

function App() {
	const onSubmit = () => {
		alert('submitted');
	};

	return (
		<div className="App">
			{/* onClick 등의 이벤트 핸들링의 중괄호에는 항상 함수가 들어가야 한다. */}
			{/* <button onClick={() => alert('hello')}>Submit</button> */}
			<button onClick={onSubmit}>Submit</button>
		</div>
	);
}

2. onKeyUp

키보드를 눌렀다가 뗐을 때 발생하는 이벤트

function App() {
    const onSubmit = () => {
        alert('submitted');
    };

    const onKeyUp = (event) => {
        if (event.keyCode === 13) {
            onSubmit();
        }
    };

    return (
        <div className="App">
            <input onKeyUp={onKeyUp}/>
            <button onClick={onSubmit}>Submit</button>
        </div>
    );
}

---

강의 링크

https://youtu.be/AJ_yDXBSkdw