[React JS]PropType 과 isRequired

우리가 이전에 했던 것을 콘솔에서 확인해보면 오류가 뜬다.

array에 있는 각 차일드는 반드시 고유한 key prop을 가져야한다.

이 말은 즉 우리는 array 안에 굉장히 많은 영화 정보를 넣을 것이다.

그런데 React는 엘리먼트가 많을 경우 key 라는 것을 줘야만 한다.

그래서 우리는 기존에 있는 코드를 

아래와 같이 변경할 것이다.

index를 넣어서 영화정보 한개당 id값으로 넘버(고유한 키값을 주는것임)를 매겨주는 것이다.

그러면 오류가 사라진다!

다음 작업을 하기 위해 yarn add prop-types 새로 인스톨하자

해당 디렉토리에서 

yarn add prop-types 해서 새로 인스톨하자

인스톨이 완료되면 movie.js 가서 PropTypes를 불러오면 된다.

import PropType from 'prop-types';

여기서 주의해라..

3일동안 헤맸다...

나는 맨처음에 이렇게 작성했었다.

static PropType = 부분을 잘 보아라

자.. 이렇게 작성하면 틀린거다.. 아래와 같이 작성해라..

아마 문제는 대소문자 구분인데,

꼭 지켜줘야 정상 작동한다.

이렇게 써야한다.. 대소문자로 나처럼 3일동안 뻘짓하지 않길 바란다..

여기서 PropTypes.string 은 문자를 뜻한다.

그리고 string을 number로 바꾸면 숫자를 뜻하고,

string.isrequired를 붙이면 요것은 필수적으로 있어야한다는 뜻이다.

만약 오류가 있으면 크롬콘솔을 확인해보면 된다.

이렇게 부모 컴포넌트에게서 받는 정보를 체크할 수 있다.

만약 api를 통해 정보를 불러온다면, 유저이름은 string 이고 필수요건이 된다.

*본 포스팅은 노마드코더의 동영상 강의를 보고 공부한 내용을 정리한 것입니다.