npm install prop-types
prop-types 패키지를 설치한다
Basic.propTypes = {
name: PropTypes.string.isRequired,
birth: PropTypes.number.isRequired,
lang: PropTypes.string,
};
propType를 보면 name, birth, lang에 대한 내용이 들어있다.
PropTypes 객체는 prop-types 패키지를 따로 설치해야 쓸 수 있는 React의 props 자료형 검사법이다.
propTypes에 정의해두었으면 React가 해당 props가 propTypes의 자료형과 일치하는지 검사한다. 다를 경우 에러를 보내기에 실수를 줄여준다.
name이 string으로 되어있는데, number이 들어왔을 경우 자료형이 일치하지 않았으니 에러가 난다. isRequired는 필수라는 뜻으로 isRequired를 설정해 둠으로서 필수로 들어와야하는 값을 알려주는 것이다. (name과 birth 속성은 반드시 있어야 한다는 것)
isRequired가 붙지 않으면 선택적이라는 의미이다.
만약 string형태로 들어와야하는 값이 number로 들어오는 경우 콘솔창은 다음과 같은 결과를 보여준다
Warning : Failed prop type: Invalid prop 'key' of type ' number' supplied to 'Component', expected 'string'
key값으로 숫자가 와야하는 것이 맞다면 PropTypes.string.isRequired를 PropTypes.number.isRequired로 바꾸어주면 된다.
