오늘 배운 React-TypeScript 지식
5615 단어 typescriptReactReact
React-TypeScript 지식
const GuGuDan = () => {
const onSubmitForm = (e) => {
e.preventDefault();
};
return (
<>
<form onSubmit={onSubmitForm}> // 1번
<input
onChange={(e) => setValue(e.target.value)} // 2번
/>
</form>
</>
);
};
위 코드에서 input
태그에 바로 onChange
속성을 주고 그 안에 함수를 작성할 경우 인자에 대한 타입 추론이 자동으로 된다.
하지만 onSubmitForm
처럼 바깥에 함수를 만들고 그 값을 인자로 전달할 경우 타입스크립트는 인자에 대한 타입 추론을 하지 못한다.
이 경우 다음과 같이 인자에 제네릭을 이용해 타입을 명시해주면 된다.
const GuGuDan = () => {
const onSubmitForm = (e: React.FormEvent<HTMLFormElement>) => { // 타입 명시
e.preventDefault();
};
return (
<>
<form onSubmit={onSubmitForm}>
<input
onChange={(e) => setValue(e.target.value)}
/>
</form>
</>
);
};
Author And Source
이 문제에 관하여(오늘 배운 React-TypeScript 지식), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@drata313/ㅁㄴㅇ저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)