v-for遍历两个数组

你可以使用 v-for 指令并结合 JavaScript 的 Array 对象的 concat() 方法将两个数组合并成一个新的数组，然后在模板中遍历该新数组。具体实现如下：

<template>
  <ul>
    <li v-for="(item, index) in mergedArray" :key="index">{{ item }}</li>
  </ul>
</template>

<script>
export default {
  data() {
    return {
      array1: [1, 2, 3],
      array2: [4, 5, 6],
    };
  },
  computed: {
    mergedArray() {
      return this.array1.concat(this.array2);
    },
  },
};
</script>

在上面的例子中，数组 `array1` 和 `array2` 被合并成了一个新数组 `mergedArray`，然后使用 `v-for` 指令在模板中遍历该新数组并显示每个元素。

相关问题

v-for遍历数组中的数组

v-for遍历数组中的数组可以使用两个嵌套的v-for指令，第一个指令用于遍历外层数组，第二个指令用于遍历内层数组。例如：

<div v-for="arr in outerArray">
  <div v-for="item in arr">
    {{item}}
  </div>
</div>

这样就可以遍历外层数组outerArray中的每一个数组，并遍历每个数组中的元素item。

vue2v-for遍历数组

在Vue 2中，我们可以使用`v-for`指令来遍历数组。

例如，假设我们有一个名为`items`的数组，我们可以在模板中使用`v-for`来遍历它：

<div>
  <ul>
    <li v-for="item in items" :key="item.id">
      {{ item.name }}
    </li>
  </ul>
</div>

在上面的代码中，`v-for="item in items"`表示对`items`数组进行遍历，每个遍历项都会赋值给`item`变量。`:key="item.id"`用于为每个遍历项指定唯一的key，这有助于Vue进行优化和渲染。

在`v-for`循环内部，我们可以使用双括号插值语法`{{ item.name }}`来显示每个遍历项的属性。

请注意，对于数组的遍历，Vue会自动追踪每个项的变化并更新DOM。如果你修改了数组，Vue会相应地更新视图。

希望这能帮到你！如果你还有其他问题，请随时提问。