javascript - 计算的 Vue 属性中的无限事件

Question

我已经构建了一个由数组（selectedItems）和布尔值（切换）组成的组件。该组件具有项目数组。

基于当前数据都持有我创建了一个计算属性：

computed:{
   isValid(){
      const {toggle, selectedItems} = this
      return toggle && selectedItems.length || !toggle && selectedItems.length < items.length
   }
}

我的模型是一个包含所有 3 个的对象：{selectedItems, isValid, toggle}

我写了一个函数来更新模型（名为output）：

    updateModel(key, value) {
      this.$emit('update', { ...this.output, [key]: value })
    }

我在更新切换或选定项时调用此函数，但我希望它也与有效性属性保持同步。

当我在计算中调用该函数时，由于某种原因，它进入了事件的无限循环，我无法弄清楚。

然后我尝试了一种不同的方法，我在计算isValid属性和我调用的处理程序中创建了一个手表updateModel（与我之前尝试调用它的方式相同，并且有效。

为什么在计算函数中调用它会导致它被一次又一次地调用？

谢谢。

标签： javascriptvue.jsvuejs2vue-component