vue 数组长度

作者：热血震荡发布日期:2025-08-02 浏览:46

// 获取 Vue 数组长度的示例代码

new Vue({
  el: '#app',
  data: {
    items: [1, 2, 3, 4, 5]  // 定义一个数组
  },
  computed: {
    arrayLength() {
      return this.items.length;  // 计算属性返回数组的长度
    }
  }
});

<!-- HTML -->
<div id="app">
  <p>数组长度是: {{ arrayLength }}</p>  <!-- 绑定计算属性，显示数组长度 -->
</div>

解释说明：

data 中定义了一个名为 items 的数组，包含了一些元素。
computed 中定义了一个计算属性 arrayLength，它返回 items 数组的长度。
在 HTML 中通过双大括号语法 {{ arrayLength }} 绑定并显示数组的长度。

如果你需要获取数组的长度并在模板中展示，这种方式是非常常见的。

上一篇：vue query传参

下一篇：vue .map