vue3和vue2的watch写法

• vue2是分模块写的，直接使用就行

// 和data平级
watch: {
  // 监听简短数据类型
  watchValue(newValue, oldValue){
  },
  // 监听对象属性
  'obj.proto'(newValue, oldValue){
  },
  // handler写法
  watchVal: {
    handler(newValue, oldValue){
    }
  },
  // 对象深度监听
  obj: {
    handler(newValue, oldValue){
    },
    deep: true
  },
  // 立即执行，immediate会使函数在组件在初始化时也执行，否则组件初始化时监听不到
  watchVal2: {
    handler(newValue, oldValue){
    },
    immediate: true
  },
}

• vue3需要从vue中导入

import { watch } from 'vue'
// 一般的监听
watch(val, (newValue, oldValue) => {
})
// 监听多个，返回的是一个数组
watch([val1, val2], (newValue, oldValue) => {
})
// 监听对象，默认开启深度监听，可以直接监听对象中的对象
watch(obj, (newValue, oldValue)=>{
})
// 监听对象属性
watch(()=>obj.pro, (newValue, oldValue) => {
})