javascript - Apabila melintasi v-for Vue, bolehkah nilai indeks dikawal pada nilai maksimum dan keluaran berulang-alik?

Question

Berkenaan Vue's v-for traversal, bolehkah nilai indeks dikawal untuk berkitar ulang-alik pada nilai maksimum?

---

Lampirkan alamat kod jsfiddle, klik untuk pergi ke kod pratonton jsfiddle>>

Kod:

<script type="text/javascript">
var vm=new Vue({
    el:'.list',
    data:{
        list:['a','b','c','d','e','f','g']
    },
});
</script>

<p class="list">
<ul>
  <li v-for="(item,index) in list">
    {{index}}<br />{{item}}
  </li>
</ul>
</p>

---

Sebagai contoh, jika anda mahu nilai indeks maksimum gelung menjadi 2, hasil yang dijangkakan adalah seperti berikut:

<p clss="list">
    0
    a
</p>
<p clss="list">
    1
    b
</p>
<p clss="list">
    2
    c
</p>
<p clss="list">
    0
    d
</p>
<p clss="list">
    1
    e
</p>
<p clss="list">
    2
    f
</p>
<p clss="list">
    0
    g
</p>

Answer 1

<p class="list">
<ul>
  <li v-for="(item,index) in list">
    {{index%3}}<br />{{item}}
  </li>
</ul>
</p>

Gunakan % untuk mencari bakinya?

Kemas kini:
=.= ditukar kepada 3 untuk mengelakkan kekeliruan. Intinya ialah %

Answer 2

Sepatutnya indeks%3

Answer 3

Saya rasa kita boleh menggunakan penapis untuk memproses indeks