Привет! Подскажите, пожалуйста, как победить. Есть v-for="item in list" внутри инициализация двух

Question

Привет! Подскажите, пожалуйста, как победить. Есть v-for="item in list" внутри инициализация двух

дочерних компонентов, в которые передаю item как входящий параметр
И ещё есть прямой вывод некоторой информации из item вне компонентов.
Примерно так:

<div v-for="item in list">
<span :class="item.class">{{item.name}}</span>
<component1 v-bind:initial-item="item"></component1>
<component2 v-bind:initial-item="item"></component2>
</div>

Проблема:
Когда делаю list.splice(2, 1) - ожидаю что третий элемент (его спан и два компонента) удалятся
По факту получаю, что удаляется спан от третьего элемента (как и нужно), но компоненты удаляются от последнего элемента в списке, а не третьего..

Почему так происходит, кто нибудь знает?

#frontend #javascript #programming #russian #vue.js

0

28.08.2019

2 ответов

33 просмотра

Kos Smokvin Автор вопроса

Подготовил пример https://jsfiddle.net/Smokvin/vs462a37/ При нажатии на кнопку - обратите внимание, что удаляется вторая строка и ЧЕТВЁРТАЯ ЦИФРА, соответствующая четвёртому компоненту, а не второму. Почему так происходит?

0

28.08.2019

Artem G · Accepted Answer

Artem G

Подозреваю, дело может быть во v-bind:key Также, я бы советовал вынести то, что внутри div-а отдельным компонентом.

0

28.08.2019

169 похожих чатов

Привет! Подскажите, пожалуйста, как победить. Есть v-for="item in list" внутри инициализация двух

2 ответов

Похожие вопросы