vue 获取 watch监听对象的的新旧差值

在Vue中，可以使用`watch`选项来监听对象的变，并获取新旧值的差异。当对象的属性发生变化时，`watch`选项会触发相应的回调函数，并将新值和旧值作为参数传递给回调函数。

下面是一个示例代码，演示了如何使用`watch`监听对象的变化并获取新旧值的差异：

// 定义一个Vue实例
var vm = new Vue({
  data: {
    obj: {
      name: 'John',
      age: 25
    }
  },
  watch: {
    obj: function(newVal, oldVal) {
      // 遍历新旧值的属性
      for (var key in newVal) {
        // 判断属性是否发生变化
        if (newVal[key] !== oldVal[key]) {
          console.log('属性 ' + key + ' 发生了变化');
          console.log('新值为：' + newVal[key]);
          console.log('旧值为：' + oldVal[key]);
        }
      }
    }
  }
});

// 修改obj的属性值
vm.obj.name = 'Tom';
vm.obj.age = 30;

在上述代码中，我们定义了一个Vue实例，并在`data`选项中定义了一个名为`obj`的对象。然后，在`watch`选项中定义了一个回调函数，用于监听`obj`对象的变化。当`obj`对象的属性发生变化时，回调函数会被触发，并将新值和旧值作为参数传递给回调函数。在回调函数中，我们可以通过遍历新旧值的属性来判断属性是否发生了变化，并获取新旧值的差异。