prop-types에 대해 알아보자
TOC
-
prop-types란?
-
공식문서
1. prop-types란?
탄생 배경
prop-types는 App이 커지면서 props들이 늘어나고 그에 따라 props의 관리가 필요해졌다. 따라서 props를 관리하는 하나의 툴이라고 생각하면 된다.
용도
부모 컴포넌트로부터 자식 컴포넌트에게 props를 넘겨준다. 이 props가 많아질 경우
prop-types를 통해 관리하는 것으로 이 props의 자료형은 무엇인지, 잘 사용된 것인지 혹은 사용되지 않았는지를 판단해 에러 메시지를 던져준다.
eslint는 이 prop-types를 사용하지 않을경우 에러를 던져준다.
2. prop-types 공식문서
prop-types는 react에서 제공하는 공식문서가 있고 이를 잘 준수하면 된다.
공식문서
에러를 미연에 방지하고 앱 개발에 도움을 주는 고마운 존재인건 확실하다
포스팅 하기에도 좋지만 포스팅을 해야겠다고 생각한 결정적인 계기는
error Typo in static class property declaration react/no-typos
위와 같은 에러 때문이다.
prop-types의 선언을 이렇게 했다.
...
import PropTypes from 'prop-types';
...
그리고 propTypes를 아래와 같이 작성하였다.
...
SearchModal.PropTypes = {
searchModalToggle: PropTypes.bool.isRequired,
setSearchModalToggle: PropTypes.element.isRequired,
};
...
그렇다. 나는 import한 이름인 PropTypes를 그대로 아래에 똑같이 적어주었다.
그런데 오류가 발생한다.
이유는
propTypes (✅)
PropTypes (❎)
위의 것은 맞고 아래 것은 틀리다.
왜 ..? 아직까지 이유는 찾지 못하였다.
하지만 위와 같은 에러 메시지 때문에 조리돌림을 당하고 있으시다면 부디 해결방법 중 하나가 되길 바란다.
Author And Source
이 문제에 관하여(prop-types에 대해 알아보자), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@zerozoo-front/prop-types에-대해-알아보자저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)