vue3 监视 watch

setup() {
    //数据
    let num = ref(0)
    let msg = ref('6666')
    let person = reactive({
      name:'大王',
      age:18,
      job:{
        j1:{
          money:20
        }
      }
    })

//情况1：监视ref定义的数据（watch有第三个参数，对象类型的，可配置是否提前监视，是否深度监视）
    watch(num,(newVal,oldVal)=>{
      console.log('值变化了',newVal,oldVal)
    },{immediate:true})
    //情况二:监视多个数据(newVal会是一个数组['0','666'],是一个由所有监视的数据所组成的集合)
    watch([num,msg],(newVal,oldVal)=>{
      console.log('值变化了',newVal,oldVal)
    })
    //情况三:监视reactive定义的数据（1：oldVal会无法正确获取！！！！2：会强制开启深度监视）
    watch(person,(newVal,oldVal)=>{
      console.log(newVal,oldVal)
    })
    //情况四：监视reactive数据中其中的一个属性（要写成一个函数的返回值类型）
    watch(()=>person.name,(newVal,oldVal)=>{
      console.log(newVal,oldVal)
    })
    //情况五：监视reactive数据中其中的一些属性（要用数组包起来）
    watch([()=>person.name,()=>person.age],(newVal,oldVal)=>{
      console.log(newVal,oldVal)
    })
    //特殊情况
    watch(()=>person.job,(newVal,oldVal)=>{
      console.log(newVal,oldVal)
    },{deep:true})//监视reactive数据中的一个对象属性时，deep配置属性是有效的