021. props를 필수 값으로 사용하기

PART 2(초급) React.js 기초 다지기

021. props를 필수 값으로 사용하기

• props의 자료형 선언 시, 자료형 설정 대신 isRequired를 조건으로 추가하면 변수값 없는 경우 경고메세지 발생할 수 있음
• 현재 상위 컴포넌트에서는 ReactString의 값을 전달하지않음
• 원래는 콘솔창에서 에러나는 모습이 보이는게 정상이지만(화면은 정상), 현재 react가 상위 버전이라 에러가 나지않는 중

 

부모(상위)와 자식(하위) 컴포넌트를 구분하는 기준은 '어디서 어디를 호출(사용)하느냐'

 

• Parent Component:다른 컴포넌트를 불러와서 사용하는 쪽 (코드상에서 <컴포넌트명 /> 태그를 쓰는 곳)
  App.js는 PropsRequired를 포함하여 화면에 그리고 있으므로 상위 컴포넌트
• Child Component: 불러짐을 당하여 상위 컴포넌트 내부로 들어가는 쪽입니다.
  예시의 R021_PropsRequired.js는 App에 의해 호출되어 화면의 일부로 나타나므로 하위 컴포넌트

import를 해서 가져온 쪽이 상위(부모), export 되어 불려간 쪽이 하위(자식)
데이터(Props)가 위에서 아래로 흐르기 때문에, 데이터를 주는 쪽이 상위, 받는 쪽이 하위가 된다.