1.先引入watch

import { ref, defineComponent, watch } from "vue";

2.在setup裡面引用

/*監聽props*/
watch(props,(newProps, oldProps) => {
    showModal.value = newProps.isOpened;
    editData.value = newProps.editData as IAdminUser;
});

watch有2個引數, 第一個引數是監聽的資料物件, 可以是單個變數、陣列、函式；
第二個引數是資料改變時的回撥函式, 有2個引數, 第一個是改變後的資料, 第二個是改變前的資料;

3.監聽多個變數

const checkTip: Ref<{name: string; password: string;}> = ref({
　　name: "",
　　password: "",
});
watch([props, checkTip],([newProps, newCheckTip], [oldProps, oldCheckTip]) => {
　　console.log(newProps, newCheckTip);
});

4.監聽物件屬性

watch(
() = > props.name,
(newName, oldName) = > {
　　console.log(newName);
},
{deep: true}
);

在vue2中watch只有一個, 而在vue3中可以存在多個watch.

原文連結：https://blog.csdn.net/weixin_39720860/article/details/114005689