watch

官网概念

 graph LRA[watch] -->B[作用]A[watch] -->C[特点]A[watch]--> D[与watchEffect的共享行为]B-->B1(侦听单个数据源)B-->B2(侦听多个数据源)C--> |1|C1(懈怠执行回调函数)C1--> C12(只有被监听的数据源扭转时才会触发回调)C--> |2|C2(明确了侦听器触发的条件和机会)C2--> C21(触发条件:被监听的数据源)C2--> C22(触发机会:被监听的数据源产生扭转)C--> |3|C3(可拜访被监听数据源发生变化前后的值)
  • 第一个参数:指定的数据源
  • 第二个参数:指定数据源发生变化时的回调
let color = ref('red'); // 定义一个数据源setTimeout(() => {    color.value = 'blue'; // 扭转数据源}, 1000);写法一// watch(//     () => color.value,//     (newValue, oldValue) => {//         console.log('newValue:', newValue);//         console.log('oldValue:', oldValue);//     }// );写法二watch(color, (newValue, oldValue) => {    console.log('newValue:', newValue);    console.log('oldValue:', oldValue);});// 上述打印后果:newValue: blueoldValue: red