[React]Props

---

1. Props란?

• Props = 컴포넌트의 속성값
• 정확히는 부모 컴포넌트로부터 전달받은 데이터를 지니고 있는 객체.
• props는 모든 데이터와 함수 전달 가능! (변수, 함수, state 값, event handler 등)

2. Props 사용법

1. 부모에서 자식 컴포넌트로 전달

먼저 부모 컴포넌트에서 자식 컴포넌트에 전달할 데이터를 설정해줘야 한다.
return문 안에 자식 컴포넌트 <Feed/>를 넣어주고, props를 tag와 value값으로 key={value} 처럼 추가해준다.

위의 예시에서는 map 메서드를 사용해 Feed를 구성했기 때문에 값의 표현이 저렇다.

여기서 key = 자식 컴포넌트에서 데이터를 받을 때 사용되는 인식표.

값이 둘 이상일 때는 넘겨주고자 하는 값 사이를 띄워서 구분하고 원하는 만큼 추가할 수 있다.

2. 자식 컴포넌트에서 데이터 적용

먼저 부모 컴포넌트에서 전달받은 props를 하나의 객체로 모아 props임을 명시한다.

매개변수 이름을 마음대로 지을 수는 있지만, 부모 컴포넌트로부터 받은 props를 표현한다는 것을 명시하기 위해 const '컴포넌트 이름' = (props) ⇒ {} 라고 매개변수 이름을 짓는 것이 컨벤션.

그리고 이렇게 명시해 준 props는 그대로 중괄호에 넣어 값으로 써줄 수 있다.