vue.js - Vue JS - 当其中使用的字段更新时,观看计算如何触发它?
问题描述
我有一个计算字段,它根据是否在问卷中填写了文本字段来设置一个名为“已完成”的数据属性:
setCompleted: function () {
this.completed = this.required && this.textAnswer !== '';
},
这个计算在我的 html 中没有引用,仅用于设置完成的属性。唯一可以更改用户输入的属性是 textAnswer,绑定为文本输入上的模型。
我有一个空的观察者设置来观察这个计算字段,如下所示:
setCompleted: function () {
},
使用手表集,这可以工作并且 setCompleted 更新,但没有手表,setCompleted 在调试时不会受到影响,并且完成时根本不会更新。
我的问题是 -当其中使用的字段更新时,观看计算如何使其更新?使用监视集,Vue 是否会监视计算对象中的每个属性以进行更改,然后在更改时运行计算对象?
注意 - 我知道我可以将其重构为观看 textAnswer 并从该手表调用一个方法来更新完成,但我想知道这段代码实际上是如何工作的,以及它是否是不好的做法,或者实际上是 Vue 允许的。
解决方案
我认为计算属性的做法是返回一个值,观察者可以看到该值。在这种情况下,完成将是计算值。
computed: {
completed: function () {
return this.required && this.textAnswer !== '';
},
},
watch: {
completed: function(val) {
console.log(val)
}
}
推荐阅读
- javascript - 在 React 中动态更新导航栏和侧边栏的最佳方法是什么?
- sql - Reading JSON array as one of the SQL table column
- vba - 硒whatsapp按钮搜索vba
- javascript - 使用 Socket.io 有效发送大坐标数组
- python - 比较 2 个字符串列表,更新相同索引位置的第 3 个字符串列表
- c# - 进程在 Ubuntu 上不工作,但在 Windows 上工作
- java - JUnit @Rule 和 ExpectedException.none() 线程安全吗?
- javascript - 用于 Rocket Chat iframe 身份验证的 NodeJS 应用程序抛出 SyntaxError: Unexpected token (
- html - My css and html code is acting very strange
- unity3d - Unity Genrics 动画控制器