一般情况下,watch 是无法监听 props 变化的
如果你想监听 props 的变化,有2个方法,一是可以手动监听对 props 的变化,二是可以使用 watchEffect
示例:
现在有个 props.testData,我们想在 props.testData 变化的时候,改变 inputValue 的值
const props = defineProps({
testData: String,
})
const inputValue = ref('')
方法一:
手动监听对 props 的变化(watch的第一个参数得用箭头函数,不然是无法监听 props 变化的)
watch(() => props.testData, (newValue,oldValue) => {
console.log(`( newValue )===============>`, newValue);
console.log(`( oldValue )===============>`, oldValue);
inputValue.value = newValue
})
方法二:
使用 watchEffect
watchEffect(() =>{
console.log(`( watchEffect - props.testData )===============>`, props.testData);
inputValue.value = props.testData
})