Vue JS - 当其中使用的字段更新时，观看计算如何触发它？

Question

我有一个计算字段，它根据问卷中是否填写了文本字段来设置名为“已完成”的数据属性：

setCompleted: function () {
            this.completed = this.required && this.textAnswer !== '';
    },

我的 html 中没有引用这个计算值，仅用于设置完成的属性。唯一可以更改用户输入的属性是 textAnswer，绑定为文本输入上的模型。

我有一个空的观察者设置来观察这个计算字段，如下所示：

setCompleted: function () {
    },    

使用 watch set，这可以工作并且 setCompleted 更新，但是没有 watch，setCompleted 在调试时不会被命中，并且 Completed 根本不会更新。

我的问题是 - 当其中使用的字段更新时，观察计算如何使其更新？ 使用 watch 设置，Vue 会观察计算中的每个属性进行更改，然后在更改时运行计算？

注意 - 我知道我可以将其重构为观看 textAnswer 并从该手表调用一个方法以更新完成，但我想知道此代码实际上是如何工作的，以及它是否是不好的做法或实际上是允许的使用 Vue。

Answer 1

我认为计算属性的做法是返回一个值，观察者可以看到该值。在这种情况下，完成将是计算值。

computed: {
  completed: function () {
     return this.required && this.textAnswer !== '';
  },
},
watch: {
  completed: function(val) {
    console.log(val)
  }
}

Answer 2

这有帮助吗？

但是，不同之处在于计算属性是基于缓存的 关于他们的依赖。计算属性只会在以下情况下重新评估 它的一些依赖项已经改变。

来自文档：https://vuejs.org/v2/guide/computed.html

根据我的经验，只要观察者返回一个值，当内部使用的属性发生变化时，它会重新评估，它会检查值是否发生变化。