[TS] 엔터쳐서 실행하기 유틸함수 만들기

e.key 가 "Enter" 일 때 실행 할 함수를 넣을 수 있다. 

  const enterPressHandler = (e: any) => {
    if (e.key === "Enter") {
      searchHandler(); //  이게 실행할 함수
    }
  };
  ...
  <StInputBox.SearchInput
              placeholder="검색 키워드를 입력해주세요."
              onChange={(e) => setSearchKey(e.target.value)}
              value={searchKey}
              onKeyDown={enterPressHandler}
            />

 

 

+ 23/12/24 추가

export const enterToProcess=( e : any, func: ()=>void )=>{
	if (e.key === "Enter") {
    	func();
    }
};

 

내 생각엔, 이렇게 util 함수로 빼놓고 파일 전체에서 불러서 써도 될 것 같다. 

다져다 쓸 땐 이런식으로!!

<button onKeyDown={(e)=> enterToProcess( e, loginHandler )}>로그인<button>