如何在二维数组上使用v-for

Question

我想使用Vue.js遍历二维数组，但是当我在另一个v-for中使用嵌套的v-for时，出现此错误：

  

  
• 表达式中无效的v-for别名“ case”：v-for =“行中的case”
  

new Vue({
  el: "#app",
  data: {
    chessboard: [
      [null,null,null,null],
      [null,null,null,null],
      [null,null,null,null],
      [null,null,null,null]
    ]
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
  <div class="chessboard">
    <div v-for="line in chessboard">
      <div v-for="case in line">
        <button></button>
      </div>
    </div>
  </div>
</div>

我应该怎么做才能使它工作？

谢谢您的帮助。

Answer 1

case是保留字:) （开关盒）

https://jsfiddle.net/3k8dghvo/

<div id="app">
  <div class="chessboard">
    <div v-for="line in chessboard">
      <div v-for="cell in line">
        <button></button>
      </div>
    </div>
  </div>
</div>