AntonBrock
@AntonBrock
screen light

Что не так с transition-group или почему «children must be keyed»?

Не могу понять, почему тут transition-group не хочет работать?
<transition-group name="collapse">
    <div class="customers">
        <SimpleCustomer v-if="!collapse" :customer="contact.last_deal_with" />
        <div class="customers--list" v-else>
           <SimpleCustomer :customer="membership.customer" :contact="contact.id" :person-post="membership.post" :collapse="collapse" :edit="edit" v-for="(membership, i) in memberships" :key="membership.customer.id"/>
        </div>
        <CreateMembership @addNewCustomer="addNewCustomer" :memberships="memberships" v-show="edit" :contact="contact"/>
      </div>
    </transition-group>
  • Вопрос задан
  • 1491 просмотр
Пригласить эксперта
Ответы на вопрос 1
WinPooh32
@WinPooh32
Stack Overflow answer searching expert
When Vue is updating a list of elements rendered with v-for, by default it uses an “in-place patch” strategy. If the order of the data items has changed, instead of moving the DOM elements to match the order of the items, Vue will patch each element in-place and make sure it reflects what should be rendered at that particular index. This is similar to the behavior of track-by="$index" in Vue 1.x.


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

thats why you should have use :key="item"

источник:
https://stackoverflow.com/questions/53194769/vuejs...
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы