Question

假设我有一个正在观看数组mylist

的观察者

watch {
 mylist:function(){
    //Code
 }
}

如何以编程方式触发变量更新并运行代码（如果变量未更改）？如果监视的变量是嵌套的对象/数组或简单的字符串，我该如何触发更新？

Answer 1

由于您没有提供有关实际用例的任何描述，您可以做的最好的方法是提取一个手动调用此方法调用的方法。

<div class="foo">First</div>
<div>(not foo)</div>
<div class="foo">Second</div>
<div>(not foo)</div>
<div class="foo">Third</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

触发＆＃34;观看＆＃34;您现在可以手动调用 handleListChange 方法。

Answer 2

有两个问题：

如果变量未更改，我如何以编程方式触发变量更新并运行代码？

你可以这样破解：

this._watchers.find(w => w.expression === "mylist").cb(this.mylist);

但是，它不是官方Vue API的一部分。 _watchers列表是一个实现细节。它可能会在未经通知的情况下发生变化。

如果监视的变量是嵌套的对象/数组，如何触发更新？

使用深度观察者：

watch: {
  mylist: {
    handler: function(val) {
      // Code
    },
    deep: true
  }
}

工作示例：https://jsfiddle.net/LukaszWiktor/zjagahq2/

Answer 3

这是我的做法
弗兰克（Frank）正在做些事情，我只是无法访问建议的“ this”上下文
所以所有要做的就是将所有参数传递给该方法。

watch: {
   myList: (...args) { this.handleListChange(...args) },
}

VueJS以编程方式触发对监视变量的更新

3 个答案: