key와 children 속성 이해하기

Created
May 11, 2024
Tags
React

모든 리액트 컴포넌트는 keyref 속성을 포함하고 있다. 그리고 children 속성을 선택적으로 포함하고 있다.

key

같은 이름의 컴포넌트가 여러 개일 때 이들을 구분하기 위해 만들어진 속성이다. key 속성의 타입은 선택적이고, 문자열이나 숫자 타입이 올 수 있다.

interface Attributes {
	key?: Key | null | undefined;
}

type Key = string | number;

children

children 속성의 타입은 선택적이다. children<div>처럼 자식 요소를 포함할 수 있는 컴포넌트에서만 사용할 수 있다. <input>, <img> 같은 컴포넌트에서는 사용할 수 없다.

children?: ReactNode | undefined;