List & Key

OwlSuri·2022년 7월 16일
0

React

목록 보기
13/20

List

  • array 사용

Key

  • 각 객체나 아이템을 구분할 수 있는 고유한 값
  • 아이템들을 구분하기 위한 고유한 문자열

여러개의 Component 렌더링하기

  • map함수 사용하기
const numbers=[1,2,3,4,5]
const doubled = numbers.map((el) => number * 2)
  • map 함수를 사용하면 아래와 같은 경고 문구가 콘솔에 뜰 수도 있는데

    각 아이템에 고유한 Key가 없기 떄문이다.
    -> key의 값은 같은 list에 있는 element사이에서만 고유한 값이면 된다.
const numbers=[1,2,3,4,5]
const doubled = numbers.map((el, index) => 
                            <li key={index}>
                            	{el}
                            </li>)

과 같이 고유한 key 값을 주면 됨. id, index 등을 사용할 수 있음

profile
기억이 안되면, 기록을 -

0개의 댓글