vue3的深度监听属性变化

<script setup>
import { ref, watch } from "vue";
const obj = ref({ name: 'amy',age:12 })

const changeName = () => {
  obj.value.name='a'
}

const changeAge=()=>{
    obj.value.age=20
}

//只有name发生变化时，watch才被触发
watch(
  () => obj.value.name,
  ()=>console.log('name发生变化')
)
</script>

<template>
  <button @click="changeName">改变name</button>
 <div>{{ obj.name }}</div>
<button @click="changeAge">改变age</button>
<div>{{ obj.age }}</div>
</template>