I have set this reactive value inside the setup
const refValue = ref('foo');
and set a watch function to it
watch(refValue, function() {
console.log("activaded")
});
the watch function gets not activated if I manually change the value,
it gets only activated if a add a function which changes the value
const changeValue = function changedValue() {
console.log("fired");
return refValue.value = 12;
}
why does watch only gets triggered when using a function to change the value,
I thought that const refValue = ref('foo'); is reactive so watch should detect all changes
import { ref,watch } from 'vue';
export default {
setup() {
const refValue = ref('foo');
watch(refValue, function() {
console.log("activaded")
});
const changeValue = function changedValue() {
console.log("fired");
return refValue.value = 12;
}
return {
refProp: refValue,
changeFuncton: changeValue
};
},
};
Advertisement
Answer
Try out immediate option and use a function as first parameter that returns the observed property :
watch(()=>refValue, function() {
console.log("activaded")
},{immediate:true});