写项目的时候，遇到过这样一个问题，两层循环，两个index，我想得到一个连续的index用于赋值计算，想了一下，我们可以这样实现（基于vue）
有一个多维数组，需要在最深层打印一个index，我希望这个index是连续的即，对于以下的代码：
1 <ul id="example-1"> 2 <li v-for="item in items"> 3 <div v-for="v in item"> 4 {{index}} {{v}} 5 </div> 6 </li> 7 </ul>
在网上找了下，大致有以下几种解决办法
一：
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 7 <title>Document</title> 8 </head> 9 <body> 10 <ul id="example-1"> 11 <li v-for="(item,index) in items"> 12 <div v-for="(v,index2) in item"> 13 {{myindex()}}{{v}} 14 </div> 15 </li> 16 </ul> 17 <script src="./vue.js"></script> 18 <script> 19 var indexnum = 0; 20 var example1 = new Vue({ 21 el: '#example-1', 22 data: { 23 items: [ 24 ['a', 'b', 'c'], 25 ['e', 'f'] 26 ] 27 }, 28 methods: { 29 myindex:function(n){ 30 indexnum++; 31 return indexnum; 32 } 33 } 34 }); 35 </script> 36 </body> 37 </html>
说明：这种方法不能再data中定义var出的 indexnum
在data里定义的话，return的是this.indexnum，改变this.indexnum导致视图更新，视图更新又导致for循环更新，myindex不断执行，这样就陷入了死循环了
二：
1 getIndex: function(pIndex, cIndex) { 2 var listId = 0; 3 for (var i = 0; i < pIndex; i++) { 4 listId += this.items[i].length; 5 } 6 listId = listId + cIndex + 1; 7 return listId; 8 }
说明：
通过传入父数组遍历到的索引pIndex(通过$parent.$index得到)，以及子数组的索引cIndex通过函数式编程得到，但是这种方法增加了计算量，不如一个自增的变量来的明了～