Vue cannot detect changes for the object in property addition or deletion., Lets take an example of user data changes,
var vm = new Vue({
data: {
user: {
name: 'John'
}
}
})
// `vm.name` is now reactive
vm.email =
[email protected] // `vm.email` is NOT reactive
You can overcome this scenario using the Vue.set(object, key, value) method or Object.assign(),
Vue.set(vm.user, 'email',
[email protected]);
(or)
vm.user = Object.assign({}, vm.user, {
email:
[email protected]
})