How to use watch listeners in Vue2 and Vue3

 data(){
     return {
         num:10
     }
 },
 watch:{
      num:{
	      /*
	       * newValue: current value * oldValue: modify the value of the last moment */
          handler(newValue,oldValue){
          	// doSomething
          },
          /*
           * deep: Boolean: Deep monitoring * true: monitor heap changes * false: only monitor stack changes (default)
           */
          deep:true/false,
          /*
           * immediate:Boolean: Whether to execute the handler function when it is first defined* true: execute the handler function when it is first defined* false: execute the handler function after modification*/          
          immediate:true/false
      }      
  }

const num = ref(0)
1. Import import {watch} from 'vue'
2. Use `const return value = watch(value to be monitored, (newVal,oldVal)=>{ }, {deep,immediate,flush})`
	 
	 Return value: You can turn off monitoring: return value()
	 Parameter 1: The value to be monitored Basic data types (Number, String, Boolean, null, undefined): () => Basic data type value Complex data types (Array, Object, Function): Directly write / () => Basic data type value Parameter 2: Analogy to the handler function in Vue2 Parameter 3: {} object, the object can have a configuration item: deep, immediate, flush,
	 		The meanings of deep and immediate have been described above. Here we mainly explain the values ​​of flush:
	 			 `flush:post/sync/pre
      				   pre (default value): before rendering, the value is changed and not rendered to the DOM
      				   post: After rendering, the value changes and is also rendered to the DOM
    				   sync: Render once per change, each time before rendering`