問題描述

關于vue的v-for遍歷的時候，index索引值能否控制在一個最大值來回循環？

附上jsfiddle代碼地址,點擊前往jsfiddle預覽代碼>>

代碼：

<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>

比如希望來回循環的索引值最大是2,期望得到的結果如下:

<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>

問題解答

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

用 % 求余數？

更新：=.= 防止誤導，改成 3 了。重點是 %

應該index%3的吧

我覺得可以用filter給index進行處理