Vue3 セットアップでのリスニング ウォッチの使用法

 ref で定義された変数は監視監視で書き込まれます。

import { ref, watch } from 'vue' 

const val = ref(0) 

watch(val, (newValue, oldValue) => {
    console.log(newValue, oldValue)
})

// 共有两种写法

//第一种 
watch([val , val1 ], ([newVal , newVal1 ], [oldVal , oldVal1 ]) => { 
    console.log(newVal)
    console.log(newVal1)
})
//第二种 
watch([val , val1 ], (newVal, oldVla) => {
    console.log(newVal)//[newVal , newVal1 ]
    console.log(oldVla)//[oldVal , oldVal1 ]
})

reactive で定義された変数は監視監視で書き込まれます。 

import { reactive, watch } from "vue";

let data = reactive({ storeId:''})

watch(
    () => data.storeId,
    val => {
        console.log('打印监听storeId', val)
    },
    { deep: true , immediate: true }
)