[React] Enter key으로 검색하기

브리·2022년 5월 1일
0

검색 버튼을 따로 두지 않고 Enter 버튼으로 동작하는 검색창을 만들기 위함. 너무 간단한 방법이지만 몰랐어서 작성한다.

1. onSubmitSearch 함수 작성하기
입력한 키가 enter 일 때만 동작하게 함.
if(e.key==="f") 와 같이 추가하면 다양한 키 이벤드를 발생시킬 수 있다.

  const onSubmitSearch = (e) => {
    if (e.key === "Enter") {
      //키를 눌렀을 때 동작할 코드
    }
  };

2. 💡onKeyPress💡 속성 주기

<input
	type="search"
    onChange={onInputSearch}
    onKeyPress={onSubmitSearch} <- 여기
    value={search}
/>
profile
무럭무럭

0개의 댓글