본문 바로가기

웹 개발/React

JSX) props.children

props.children

컴포넌트 태그는 대부분 props를 사용한다면, <Component props="propsValue" /> 다음과 같은 형식으로 호출합니다. 

또는 다음과 같이 호출할 수도 있습니다. 

<Component>world</Component>

 

이렇게 컴포넌트 태그 사이에 전달된 world 라는 값은 Componenent 컴포넌트에서 사용하려면 props.children값을 사용하면 됩니다. 

...

const Component = props => {

	return <div> hello {props.children} </div>;
}

...

항상 그냥 props 값을 전달하기만 해서 이번에 책을 읽으며 처음 알게 된건데 사실 이걸 언제 사용해야 될지는 잘 모르겠습니다.;;


References

  • 리액트를 다루는 기술 (김민준)