Переменные цикла в Vue.js похожи на AngularJS

Question

В моем приложении vue.js Я хочу знать последний повторяющийся элемент в директиве v-for. Я знаю, что в angularjs есть нечто подобное с переменной цикла $last в директиве ngRepeat :

<div ng-repeat="(key, value) in myObj">
  <span ng-if="$last">Shows if it is the last loop element</span>
</div>

Есть ли в vue.js какой-либо эквивалент, о котором я не знаю, или я должен реализовать какую-то собственную логику?

Answer 1

Основываясь на ответе @Nisha, я делаю это:

<template v-for="(obj, index) in originalData">
    <template v-if="index == 0 || (index >= 1 && obj.valueA !== originalData[index - 1].valueA)">
        {{ obj.valueA }}
    </template>
</template>

Я хочу, чтобы цикл всегда выполнялся в первый раз, но впоследствии проверял значение для каждого цикла условно.Я использую <template> теги, чтобы избежать вывода ненужной разметки.В моем примере originalData - это массив объектов.

Answer 2

вы также можете поместить логику в вычисляемое свойство:

  <div v-for="(value, key) in myObj">
    <span v-if="key === last">This is the last loop element : {{ value }}</span>
  </div>

  //...
  computed: {
    last() {
      let keys = Object.keys(this.myObj)
      return keys.slice(-1)[0]
    }
  }

здесь скрипеть

Answer 3

у меня работает :)

<div v-for="(item, index) in items">
    <span  v-if="index === (items.length-1)">This is the last loop element</span>
</div>

Answer 4

Вы можете попробовать это

<div v-repeat="myObj">
 <span v-if="$index === (myObj.length-1)">Shows if it is the last loop element</span>
</div>

Answer 5

Вы можете сделать это вместо этого, проверьте индекс, если он последний

  <div v-for="(value, key, index) in myObj">
     <div v-if="index === Object.keys(myObj).length-1"> my content</div>
  </div>

Answer 6

Этого нет в Vue, нет.