VUE3 中使用 watch 监听

<script setup lang="ts">
import { watch } from "vue";

let test1 = ref(0);
let test2 = ref("a");

// 监听单个变量
watch(
  () => test1.value,
  (newValue, oldValue) => {
    console.log("newValue =>", newValue);
    console.log("oldValue =>", oldValue);
  }
);

// 监听多个变量
watch(
  () => [test1.value, test2.value],
  (newVal, oldVal) => {
    // 此时返回的是数组,按下标获取对应值
    // test1 的 newVal 和 oldVal
    console.log("test1.newVal => ", newVal[0]);
    console.log("test1.oldVal => ", oldVal[0]);
    // test2 的 newVal 和 oldVal
    console.log("test2.newVal => ", newVal[1]);
    console.log("tese2.oldVal => ", oldVal[1]);
  }
);
</script>