Typescript 타이핑 질문입니다.
146
작성한 질문수 52
얼마 전에 제로초님 타입스크립트 강좌를 들어서 거기서 배운 걸 이 강좌의 코드에 적용해보고 있습니다.
NodeBird 컴포넌트의 경우 아래처럼 작성했는데요.
const NodeBird: React.FC<{ Component: React.ComponentType }> = ({ Component }) => {
return (
<>
<Head>
<meta charSet="utf-8" />
<title>NodeBird</title>
</Head>
<Component />
</>
)
}
export default NodeBird;
강의에 나온 PropTypes를 이용한 코드에서는
NodeBird.propTypes = {
Component: PropTypes.elementType.isRequired
}
위와 같이 작성하셨는데, 혹시 타입스크립트에서는 어떤 식으로 작성해야할까요? 타이핑을 해줄 때 Props의 타입에 따로 null을 처리해주지 않은 것만으로도 충분할까요?
그리고 한 가지 질문이 더 있는데요.
LoginForm 코드에서 onChangeId를 타이핑할 때
const onChangeId = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
setId(e.target.value);
}, []);
위와 같이 진행했는데, React.ChangeEvent가 generic으로 HTMLInputElement를 받는 것이 맞나요? antd의 Input을 넣었더니 e.target.value 에서 에러가 나더라고요.
답변 1
0
타입스크립트에서는 propTypes를 쓰지 않아서 지금처럼만 하시면 됩니다.
아래의 경우는 e.currentTarget.value 쓰셔야합니나.
0
감사합니다! 저 혹시 e.target과 e.currentTarget이 정확히 어떻게 다른지 알려주실 수 있을까요? 검색해봤을 때 나오는 onclick 이벤트를 이용해서 설명한 예제에서는 e.currentTarget은 click event가 발생한 element를 포함하고 있는 body element를 가리키는 것으로 나오고, e.target은 구체적으로 click event가 발생한 element를 가리키더라고요. Input element의 경우, 특히 위의 경우처럼 value를 처리해야하는 경우에는 e.target.value와 e.currentTarget.value에 어떤 차이가 있나요?
0
currentTarget은 이벤트를 단 태그이고, 타겟은 이벤트가 발생한 태그입니다. 버블링 캡처링때문에 발생한 태그와 이벤트를 단 태그가 다를 수 있습니다. 인풋류는 커런트타겟해도 됩니다.
넥스트 버젼 질문
0
75
2
로그인시 401 Unauthorized 오류가 뜹니다
0
88
1
무한 스크롤 중 스크롤 튐 현상
0
172
1
특정 페이지 접근을 막고 싶을 때
0
103
2
createGlobalStyle의 위치와 영향범위
0
93
2
인라인 스타일 리렌더링 관련
0
90
2
vsc 에서 npm init 설치시 오류
0
146
2
nextjs 15버전 사용 가능할까요?
0
158
1
화면 새로고침 문의
0
119
1
RTK에서 draft, state 차이가 있나요?
0
151
2
Next 14 사용해도 될까요?
0
452
1
next, node 버전 / 폴더 구조 질문 드립니다.
0
348
1
url 오류 질문있습니다
0
210
1
ssh xxxxx로 우분투에 들어가려니까 port 22: Connection timed out
0
372
1
sudo certbot --nginx 에러
0
1271
2
Minified React error 콘솔에러 (hydrate)
0
467
1
카카오 공유했을 때 이전에 작성했던 글이 나오는 버그
0
245
1
프론트서버 배포 후 EADDRINUSE에러 발생
0
325
1
npm run build 에러
0
517
1
front 서버 npm run build 중에 발생한 에러들
0
381
1
서버 실행하고 브라우저로 들어갔을때 404에러
0
335
2
css 서버사이드 랜더링이 적용되지 않아서 문의 드립니다.
0
283
1
팔로워 3명씩 불러오고 데이터 합쳐주는걸로 바꾸고 서버요청을 무한으로하고있습니다.
0
235
2
해시태그 검색에서 throttle에 관해 질문있습니다.
0
198
1





