Vue watch 复杂对象变化，oldvalue 和 newValue 一致，解决办法。

watch的常规用法：

watch:{
  tempData: function (value, oldValue) {
      console.log(value, oldValue)
  }
}

但是如果需要监听的数据是对象、内嵌多层的对象后，需要用到watch中的deep属性。类似于下面这种对象内嵌的对象：

data: () => ({
    tableData:{
       lineData:[
          {"name":"线路1","type":"长途"},
          {"name":"线路2","type":"本地"},
       ]
    }
})

如果tableData内部属性发生了变化，通过watch就会打印出newValue，oldValue，但是他们打印出来的结果都是一样的。因为数据同源，虽然可以监听到数据发生了变化，但是要比较数据差异就不行了。如果想要得到差异内容，可以结合计算属性、序列化、反序列化生成新的对象，来避免此问题 。代码如下；

computed:{
  tableDataNew(){
      return JSON.parse(JSON.stringify(this.tableData));
    }
},
watch:{
  tableDataNew: {
    handler: function (newValue, oldValue) {
        console.log(newValue, oldValue);
    },
    deep: true
  }
}