onSubmit, input 엔터 누를경우 submit으로 넘어감

Harry Jung·2023년 1월 20일
0

폼 안에서 input이 있는 경우
저장을 눌러야 submit으로 넘어가야 하는데
계속 엔터만 쳐도 submit으로 넘감

<form onSubmit={e=>{e.preventDefault(); handleSubmit(onSubmit)}}>

위 처럼 e.preventDefault()를 입력하면 넘어가지 않음.


<button onClick={()=>{action()} >

요점은
1. onClick 일 경우 : enter를 치거나, 버튼을 클릭할 때, submit 으로 넘어감.

  1. onClick + e.prevetDefault()하면 : enter는 submit으로 넘어가나, click은 callback 이 됨.

  2. onClick + type="button"을 하면 : enter는 아무 작동이 안되고, click은 callback 이 됨.

위 3가지와 react-hook-form 을 사용하여 좀 더 유연하게 form을 사용하면 개발이 더 쉬워짐.

profile
Dreamsoft

0개의 댓글