vue3中watch一个reactive对象，新旧值一样的问题

watch用法中提到，在变更 (不是替换) 对象或数组时，旧值将与新值相同，因为它们的引用指向同一个对象/数组。Vue 不会保留变更之前值的副本。

const obj = reactive({
  name: '111',
  age: 14,
})
const obj2 = computed(() => {
  return JSON.parse(JSON.stringify(obj))
})



setTimeout(() => {
  obj.name = '222'
}, 1000)
setTimeout(() => {
  Object.assign(obj, { name: '王五', age: 789 })
}, 2000)



watch(obj, (newVal, oldVal) => {
  console.log('值改变了', newVal, oldVal)  // 虽然都能监听到 但是newVal和oldVal一样，指向同一个地址
})

watch(() => obj.name, (newVal, oldVal) => {
  console.log('name值改变了', newVal, oldVal) // 监听某个属性 可以拿到oldVal
})

watch(obj2, (newVal, oldVal) => {
  console.log('值改变了', newVal, oldVal) // 通过计算属性深拷贝 可以拿到oldVal
})