React Props children

최재홍·2023년 4월 14일
0

children이란?

자식 컴포넌트로 정보를 전달하는 또 다른 방법.

ex)

<script>
import React from "react";

function User(props) {
  return <div>{props.children}</div>;
}

function App() {
  return <User>안녕하세요</User>;
}
export default App;
</script>

부모 컴포넌트의 선언부에서 자식 컴포넌트를 호출할 때, 자식 컴포넌트 태그 사이에 어떤 데이터를 넣으면, 이전에 배운 것처럼 자식 컴포넌트 태그에 속성을 부여하지 않아도, 암시적으로 props를 넘겨준 것 같은 효과를 볼 수 있다.
이 경우, props에 대한 속성명을 명시적으로 표현한 것이 아니기 때문에 자식 컴포넌트에서 호출할 때는 항상 'props.children'로 표현을 해야만 접근할 수 있다. 이 경우 props.children === "안녕하세요"가 된다.

0개의 댓글