Vue V-для привязки массива к неправильным компонентам

В моем состоянии Vuex у меня есть объект, содержащий массив orderLines, в моей модели я получаю доступ к этому объекту с помощью геттера и циклически перебираю orderLines, создавая для каждого компонента.

Теперь, когда я запускаю мутацию удаления, я также запрашиваю обновление объекта заказа и заменяю старый на правильный новый. Пока все хорошо... все мои компоненты получают новый объект заказа и обновляют свои списки.

Но они не создают/пересоздают компоненты в цикле, они просто обновляют индексы ->, что приводит к следующей проблеме:

Если я удалю верхний элемент, все данные следующего элемента будут привязаны к «удаленному» компоненту и его состоянию:/

       <div v-for="orderLine in order.order_lines">
          <order-line :order-line="orderLine" ></order-line>
       </div>

vuex vuejs2 vue-component v-for
person Vincent T    schedule 21.06.2017    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Используйте ключ.

<div v-for="orderLine in order.order_lines" :key="orderLine">
      <order-line :order-line="orderLine" ></order-line>
</div>

Если у каждой строки order_line есть идентификатор, это будет еще лучший ключ.

person Bert    schedule 21.06.2017