watch object vue code example
Example 1: vue watch deep
export default {
name: 'ColorChange',
props: {
colors: {
type: Array,
required: true,
},
},
watch: {
colors: {
// This will let Vue know to look inside the array
deep: true,
// We have to move our method to a handler field
handler(value) {
console.log('The list of colors has changed!', value);
}
}
}
}
Example 2: vue watch child property
...
watch:{
'item.someOtherProp'(newVal){
//to work with changes in "myArray"
},
'item.prop'(newVal){
//to work with changes in prop
}
}
Example 3: vue watch object member
// Use a deep watcher for that:
watch: {
item: {
handler(val){
// do stuff
},
deep: true
}
}