:key에 index를 써도 되는 경우, 안되는 경우

ooz·2021년 8월 1일
0

vue

목록 보기
15/15
post-custom-banner

key에 들어있는 값은 화면을 다시 그려야할지 말지 판단하는 기준이 된다.

  1. index가 변하지 않는 경우에는 key에 index를 넣어도 괜찮을 듯!
    • 예: [1, 2, 3, 4, 5] 라는 배열이 있을 때 이 배열의 원소가 계속 늘어나거나 수정만 될 때. 계속 늘어나거나 원소 값이 수정되어도 인덱스는 같으니까.
  2. index가 변하는 경우에는 key에 다른 값을..
    • 예: [1, 2, 3, 4, 5, 6, 7] 라는 배열에서 만약 3이 지워지면 3에 대한 것만 업데이트 될 것 같지만 사실은 그 다음에 있는 4, 5, 6, 7의 인덱스도 바뀌기 때문에 4, 5, 6, 7 모두 다시 그려지게 됨. 불필요한 렌더링 발생
  3. 그럼 무엇을 key로 사용하나...?
    • index + math.random() .. 정도..
profile
사는 것도 디버깅의 연속. feel lucky to be different🌈 나의 작은 깃허브는 https://github.com/lyj-ooz

0개의 댓글