在 Vue.js v2.x 中使用 v-for 指令时，如何指定范围的起始值？

Question

我正在努力打印出用户可以点击 Vue.js 中寻呼机组件的页码。我看到文档明确指出 v-for 可用于范围：

v-for 也可以取整数。在这种情况下，它将重复该模板多次。

<div> <span v-for="n in 10">{{ n }} </span> </div>

结果：

1 2 3 4 5 6 7 8 9 10

根据https://v2.vuejs.org/v2/guide/list.html#v-for-with-a-Range

无论如何我还没有找到指定 n 的起始值。似乎是从 1 开始，以 1 递增，直到 10。

有没有办法从 5 开始？

看起来我几乎需要创建一个方法或计算属性，它将返回一个包含我想要迭代的精确值的数组，以代替静态 10。

还有其他想法吗？

Answer 1

无法v-for在n处启动 a 。

但是，从偏移量开始非常简单，只需将偏移量添加到您的值中，然后在达到最大值时停止。

<div>
  <template v-for="n in max">
    <span v-if="n + offset <= max">{{ n + offset }} </span>
  </template>
</div>

如果您需要更多控制，computed属性绝对是最佳选择，因为它可以让您完全控制您正在迭代的任何内容。

<div>
  <span v-for="n in computedArr">{{ n }} </span>
</div>

  computed: {
    computedArr() {
      let arr = [];
      for (var i = this.offset; i <= this.max; i++)
        arr.push(i);
      return arr;
    },
    ...