[포스코 x 코딩온] 풀스택 웹 개발자 부트캠프 React - props

Component 블로깅에서 데이터를 전송할 때 props를 사용한다고 했었는데 이번 블로깅에서 자세히 알아보자

 

props란?

 - properties를 줄인 표현으로 Component 속성을 설정할 때 사용하는 요소

 - props는 Component끼리 값을 전달하는 수단

 - 상위 Component에서 하위 Component로 전달(단방향 데이터 흐름!)

 

함수형 Component 

 - 부모 Component에서 전달한 props는 함수형 Component에서 함수의 parameter로 전달받으며, JSX 내부에서 {} 기호로 감싸서 사용

 - 예시

defalutProps

props.children

 - 부모 component에서 자식 component를 호출할 때 태그 사이에 작성된 문자열

propTypes

- component의 필수props를 지정하거나 props의 타입을 지정할 때 사용

 - javascript의 '유연한 특성'을 해결하기 위해 권장되는 기능

 - 정해진 타입이 아닌 다른 타입으로 정보가 전달될 시, 제대로 동작은 하지만 console에서 오류가 나온다.

클래스형 Component

함수형 Component