[React] 스페이스바 안먹히는 오류 - 개인적 기록

프로젝트를 앞단은 React로 진행하게되었다.

input 박스에 스페이스(공백) 이 안먹히는 오류가 생겨서 

아무리 구글링을 해도 찾을 수가 없었다.

 

공백이 안먹히길래 아마 리액트 언어의 문제일꺼라고 생각했다

( 말도안되지만 이런 생각을 하게된것이..스페이스바가 안먹힐 이유가없었다)

 

 

리액트를 사용하면서도 가끔 제이쿼리를 쓰기도 한다.

첫 페이지가 로그인 페이지로 되어있는데

아이디와 패스워드에 공백이 포함되만 안됨으로,

이렇게 keyCode를 받아서 방지처리를 해주었다.

 

 

리액트는 한페이지내에서 컴포넌트들을 호출하는 언어이다.

로그인할떄 저 코드하나로 모든 페이지에서 스페이스 바가 안먹혔던 것이다.

 

가끔 스페이스바 가 가능 할때도 있엇는데

그땐 새로고침 하여 로그인 로직이 아닌 자동로그인 로직을 타고 들어왔을때 이다.

 

 

범인이 누군지 한참 찾앗는데 나였다;;

 

  const handleInputPwd = (e) => {

    setInputPwd(e.target.value.replace(/ /g, ''));

    setInputPwClass('');
  }

 

onChange 로 값을 받을때, 

setInputPwd(e.target.value.replace(/ /g, ''));

코드를 추가 해줌으로 공백 입력 제한 을 주었다.

 

리액트 인강에서 필수로 알려줘야하는거 아닌가 싶다..

documents쓰지말라고.. 전체 페이지 다먹는다고......