vue2 computed监听数组

在Vue 2中，`computed`属性可以用来创建读-only响应式计算属性，如果这些属性依赖于数组，你可以通过监听数组的变化来实时更新计算结果。当你需要基于数组的内容执行一些复杂的计算时，这是非常有用的。

例如，假设你有一个名为`items`的数据数组，你想根据数组长度显示一条消息，你可以这样做：

data() {
  return {
    items: [], // 初始化为空数组
    message: ''
  }
},
computed: {
  itemCount() {
    // 当items数组变化时，这个计算属性会自动更新
    return this.items.length;
  }
},
watch: {
  items(newItems) { // 监听items数组的变化
    if (newItems.length > 0) {
      this.message = '有 ' + this.itemCount + ' 个项目';
    } else {
      this.message = '';
    }
  }
}

在这个例子中，`itemCount`是计算属性，当`items`数组发生变化时，`itemCount`会被自动计算。同时，我们使用`watch`来监听数组变化，并根据数组长度动态设置`message`值。