키는 리액트가 요소를 추적 할 수 있도록 안정적이고 예측 가능하며 고유해야 합니다.
이 스니펫에서 각 요소의 키는 표시되는 데이터에 연결되지 않고 순서를 기반으로 합니다. 이것은 리액트가 할 수있는 최적화를 제한합니다.
{
todos.map((todo, index) => <Todo {...todo} key={index} />);
}'todo.id'가이 목록에 고유하고 안정적이라고 가정하면 React는 요소를 재평가 할 필요없이 요소를 재정렬 할 수 있습니다.
{
todos.map((todo) => <Todo {...todo} key={todo.id} />);
}