React Props

props (“properties”의 줄임말) 

 

개요

간단히 정의
Tsx & Jsx Tag를 통해 component를 생성&사용할 때 서로간 값을 전달하기 위한 매개체다.

<div>
    <ComponentA
        ComponentAA={ <h2>...</h2> }
        ComponentAb={ <h2>...</h2> }
    />
</div>

ComponentA에 ComponentAA와 ComponentAB를 정의해 전달한다. ComponentA는 내부에서 ComponentAA와 ComponentAB를 필요에 따라서 사용할 수 있다.

 

props에 부가적 설명

하나의 component에서 다른 component로 전달되는 argument다.
상위 component가 하위 component의 Props를 정의해준다.
(하위를 포함하는) 상위에서 하위로만 전달할 수 있다
하위 component에 대한 Props 타입은 interface 로 정의한다.

 

class constructor에 사용

클래스 컴포넌트는 항상 props로 기본 constructor를 호출해야 한다.

class Clock extends React.Component {
  constructor(props) {
    super(props);
    //...
  }
}

 

2022.11.19 - React props.children

2022.11.19 - React props 합성 (Composition) Ex