onKeyUp, onKeyDown, onKeyPress 차이, enter 입력 시 이벤트

onKeyDown

키를 눌렀을 때 이벤트 발생
키를 입력하면 이벤트 발생 후 문자가 입력 됨
shift, alt, controll, capslock 등 모든 키에 동작
한영변환, 한자 등 특수 키는 인식 못함
Keycode값

onKeyUp

키를 눌렀다가 놓았을 때 이벤트 발생
키를 입력하면 문자 입력 후 이벤트 발생
Keycode값

onKeyPress

실제로 글자가 써질 때 이벤트
키를 입력하면 이벤트 발생 후 문자가 입력 됨
ASCII 값
ASCII값이기 때문에 shift, ctrl, backspace, tab, enter, 한/영 등의 키를 인식하지 못한다.

input 에서 엔터 입력 시 이벤트 실행 예시

<input type="password" name="" id="" className="" placeholder="비밀번호"
       value={pw}
       onChange={(e)=>setPw(e.target.value)}
       onKeyPress={(e)=>{if(e.key==='Enter'){login()}}}
/>