onChange event type

 const handleSearchInput = (e: string) => {
    setMall(e.target.value);
  };

 

이런 식으로 타입 지정을 해줬는데 target에서 string' 형식에 'target' 속성이 없습니다.라는 에러가 났다.

 

input 태그에 마우스를 대보면

(property) JSX.IntrinsicElements.input: DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>
이런 설명을 해주는데 이거를 타입으로 지정해줘야한다!

대신 핸들러는 빼줘야 한다.

 

결과적으로

React.ChangeEvent<HTMLInputElement> 이걸 타입으로 지정해주면 더이상 에러가 발생하지 않는다.

 

 const handleSearchInput = (e: React.ChangeEvent<HTMLInputElement> ) => {
    setMall(e.target.value);
  };

 

참조

https://velog.io/@ahn0min/TypeSCript-event-%EC%9D%98-type-%EC%9D%80-%EB%AC%B4%EC%97%87%EC%9D%BC%EA%B9%8C