为什么当两个响应式数据突变超级关闭时，Vue 只会更新一次？

【问题标题】：Why Vue will update only once when two reactive data mutation super close?为什么当两个响应式数据突变超级关闭时，Vue 只会更新一次？
【发布时间】：2021-03-10 03:07:32
【问题描述】：

请看这个最小的例子

export default {
  data() {
    return {
      name: "Amy",
      age: 18,
    };
  },
  computed: {
    combinedDataForWatching() {
      return {
        name: this.name,
        age: this.age,
      };
    },
  },
  watch: {
    combinedDataForWatching() {
      console.log("Triggered!");
    },
  },
  mounted() {
    setTimeout(() => {
      this.name = "Bob";
      this.age = 20;
    }, 1000);
  },
};

控制台只会记录一次"Triggered!"，为什么会这样？

而 Vue 是如何确定这批更新的？

【问题讨论】：

标签： javascript vue.js vuejs2 vue-component vue-reactivity

【解决方案1】：

来自Vue guide on reactivity：

如果您还没有注意到，Vue 会异步执行 DOM 更新。每当观察到数据更改时，它将打开一个队列并缓冲同一事件循环中发生的所有数据更改。如果同一个 watcher 被多次触发，它只会被推入队列一次。这种缓冲的重复数据删除对于避免不必要的计算和 DOM 操作很重要。然后，在下一个事件循环“tick”中，Vue 刷新队列并执行实际的（已经去重复的）工作。

因此，这两个监视触发器更新都发生在同一个更新周期中，并且被反应系统“重复数据删除”到一个调用中。

【讨论】：

好的，谢谢您的信息。知道如何解决吗？
@ValentinHeinitz - 它没有坏，这里没有什么可修复的。