728x90
onChange, onClick 등에 함수를 추가해 줄때,
우린 해당 event 에 대한 타입을 추가해 주어야한다.
귀찮을때는 그냥 any...
TS를 쓰는 멋쟁이들에게 any란 있을 수 없는법
type은 굳이 검색해서 찾을 필요 없다.
onChange 속성위에 마우스를 올려놓으면

친절하게 알려준다.
하지만 저 값을 그대로 쓰면


'Property 'target' does not exist on type 'ChangeEventHandler<HTMLInputElement>'
target 속성이 없다고 나온다.
왜냐면..
해당 속성은 onChange 함수의 타입이기 때문이다 : )
우리가 원하는건 Handler 의 타입이 아니기에 Handler 를 지워주고
React.ChangeEvent<HTMLInputElement>
로 수정해준다!!

짜잔~
추가로
많이 사용되는 onClick!!
해당 함수의 event는
React.MouseEvent<HTMLButtonElement>
이다!
은근 생각안나서 찾아보거나 하는데, (저만 그럴지도)
한번씩만 잘 기억해두면 찾아두거나 할필요 없이 스스르륵 써지니
이 기회에 머릿속에 잘 저장해두는것을 추천드립니당 ㅎㅎ
728x90
'Front-end' 카테고리의 다른 글
[React] try-catch, error 타입 잡기 (1) | 2024.03.06 |
---|---|
[TS] is 사용해서 타입가드 만들어보기 (0) | 2024.02.22 |
[React] React에서 Django로 파일 보내기, headers 를 조심해!! (feat. Content-Type) (0) | 2024.02.20 |
[FE] dangerouslySetInnerHTML , 페이지 내부에 html값 넣기 (0) | 2024.02.15 |
[React] useSWR 맛보기 (0) | 2024.01.31 |