Vue.js 中使用 v-for 循环输出二维列表

在 Vue.js 中，可以使用 'v-for' 指令来循环输出二维列表。以下是一个简单的例子：

<template>
  <div>
    <div v-for='(row, rowIndex) in matrix' :key='rowIndex'>
      <div v-for='(value, colIndex) in row' :key='colIndex'>
        {{ value }}
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      matrix: [
        [1, 2, 3],
        [4, 5, 6],
        [7, 8, 9]
      ]
    }
  }
}
</script>

在上述代码中，使用了两个嵌套的 'v-for' 循环。外层循环遍历二维列表的每一行，内层循环遍历每一行的元素。通过 '{{ value }}' 输出每个元素的值。关键点是给每个循环设置一个唯一的 'key'，以便 Vue.js 能够正确地跟踪每个元素的变化。