有没有办法像使用 Vue.delete 一样更新属性?
我有这个方法:
let element = event.target
let url = '/admin/services/changePriorityStatus/' + element.dataset.id
this.$dialog.confirm('Are you sure you want to change priority status of this service?',{
loader: true
}).then((dialog) => {
axios.post(url, {
id: element.dataset.id,
priority: element.dataset.priority
})
.then((response) => {
let data = response.data
dialog.close()
let serviceIndex = this.services.findIndex(service => serviceID)
Vue.delete(this.services, serviceIndex);
Event.$emit('message:show', {
messageTitle: data.messageTitle,
messageText: data.messageText
}, data.class)
})
.catch((error) => {
alert('Something went wrong. Please try again a bit later')
dialog.close()
})
})
.catch(() => {
console.log('Changing status canceled')
});
如果有可能,我想用一些全局更新方法替换 Vue.delete 。有没有办法做到这一点?
答案 0 :(得分:4)
是Vue.set
。但是,只有在向对象添加新属性时才需要它,而不是在更新已经反应的属性时。
有关详细信息,请参阅https://vuejs.org/v2/guide/reactivity.html#Change-Detection-Caveats:
更改检测警告
由于现代JavaScript的局限性(以及放弃
Object.observe
),Vue无法检测属性添加或删除。 由于Vue在执行期间执行getter / setter转换过程 实例初始化时,属性必须存在于数据对象中 为了让Vue转换它并使其反应。Vue不允许动态添加新的根级反应 已创建实例的属性。但是,有可能 使用
Vue.set(object, key, value)
方法将反应属性添加到嵌套对象。