[React] isRequired를 활용하여 필수 propTypes을 설정해보자

propTypes이 지정하지 않았을 경우 오류가 발생합니다. 

 

저는 isRequired를 활용하여 예시를 들어 볼까 합니다.  PropsTypes 할때 뒤에 isRequired 붙이면 됩니다. 

 

예시를 통해 확인해 보겠습니다.

 

ProjectNumber를 필수 props로 지정 

 

 

 

ProjectNumber를 필수 props로 지정 하고 App.js에 projectNumber를 설정하지 않고 console창을 확인해 보겠습니다

 

오류

오류내용을 확인해보면 ProjectNumber 필수로 지정한 props 값이 undefined 되었다고 표기 되어 집니다 

 

오류를 해결 하기 위해서 App.js에서 Mycomponent를 불러온 값에 ProjectNumber={1}을 넣고 결과값을 확인해 보겠습니다.

 

App.js

 

 

 

결과값

 

 

경고가 사라지고 옳바르게 메세지가 출력된것이 보이시죠?

 

마지막으로 PropTypes에서는 여러가지 종류가 있고 설정이 가능합니다.