v-for 키 속성이 특정 v-for 내에서 전체적으로 고유해야 하는지 또는 고유해야 하는지 여부

v-for 키 속성이 특정 v-for 내에서 전체적으로 고유해야 하는지 또는 고유해야 하는지 여부

이 문서에서는 이 시스템이 얼마나 독특한지에 대해 명확하게 설명하지 않았습니다.key속성은 a 내에 있어야 합니다.v-for특정 인스턴스 내에서 고유해야 한다고 생각합니다.v-for서로 떨어져 있어야만 할 수도 있고v-for같은 키를 가진 요소가 있는 경우.

https://vuejs.org/v2/guide/list.html#key

페이지에 v-for가 있는 두 인스턴스가 있는 구성 요소가 있는 경우 두 구성 요소 모두에 동일한 키를 가진 요소를 가질 수 있습니까?

이 키는 데이터 센터 내의 고유한 키입니다.v-forVue는 특정 목록의 뷰 모델 요소와 DOM 요소를 관련짓기 위해 사용합니다.내부 요소 사이에 혼동이 발생할 가능성은 없습니다.v-for그리고 그 밖에 있는 사람들은, 그렇지 않으면, 모든 요소들은key.

실제로는 약간의 뉘앙스가 있습니다: 키는 부모 요소의 모든 자녀에 대해 고유해야 합니다.

따라서 v-for 디렉티브를 사용하는 두 요소가 동일한 상위 요소의 하위 요소인 경우 이러한 두 요소가 동일한 키를 공유해서는 안 됩니다.

요전에는 이 상황이 혼란스러웠습니다(xTick과 yTick 어레이 2개가 모두 값 '0'을 포함할 수 있으며, 이로 인해 충돌이 발생했습니다).

 <g>
  <line
    v-for="(position) in xTicks"
    :key="position.toString()"
    ...
  />
  <line
    v-for="(position) in yTicks"
    :key="position.toString()"
    ...
  />
</g>

다음과 같은 키를 접두사로 지정하면 해결됩니다.

`xtick-${position.toString()}`

참고 자료: https://forum.vuejs.org/t/v-for-key-does-the-key-need-to-be-unique-across-the-entire-component/28040

언급URL : https://stackoverflow.com/questions/48104709/should-v-for-key-property-be-globally-unique-or-unique-within-a-particular-v-for