vue2删除对象属性为什么不监听

在Vue.js中，当使用Vue实例的数据属性作为视图模板中的数据绑定时，Vue会自动追踪这些属性的变化，并及时更新视图。这种自动追踪是通过Object.defineProperty()方法来完成的，它会给对象的每个属性都添加一个getter和setter函数。当属性的值被修改时，Vue会检测到变化并更新视图。

然而，Vue默认只会追踪对象的已有属性，而不会追踪对象的新增属性或删除属性。这是因为在Javascript中，对象属性的新增和删除是无法被直接拦截的。

当我们使用Vue删除对象的属性时，实际上是通过Vue的$delete方法来实现的，该方法会调用数组的splice方法来删除元素。这种方式虽然能够删除对象的属性，但由于splice方法不会触发对象属性的setter函数，因此Vue无法检测到属性的变化，从而无法及时更新视图。

为了解决这个问题，Vue提供了一种办法来修改对象的属性而不是删除它，即使用Vue.set()方法或者直接给对象属性赋新值。这样可以保持对象的引用不变，从而让Vue能够追踪到对象属性的变化并更新视图。

总而言之，Vue默认只会追踪对象的已有属性的变化，而无法追踪新增属性或删除属性的变化。为了让Vue能够追踪到对象属性的删除操作，我们需要使用Vue的特定方法来修改属性或者给属性赋新值。

在Vue 2中，当我们使用Vue的$delete()方法来删除对象的属性时，Vue不会监听这个操作，这是因为Vue的响应式系统是基于JavaScript的Object.defineProperty()方法来实现的，而Object.defineProperty()方法只能对已经存在的属性进行响应式绑定。

当Vue初始化一个组件时，它会将组件中所有的属性都进行响应式绑定。这意味着这些属性会被转化成getter和setter，并被Vue的响应式系统所捕获和监听。当我们对这些属性进行修改时，Vue会自动更新视图。

但是，当我们使用$delete()方法删除一个对象的属性时，由于该属性并不存在于组件实例初始化时的属性列表中，因此Vue无法为该属性建立响应式绑定。这就导致了当我们删除属性后，该属性的更改不会触发视图的更新。

除此之外，还有一些其他的原因导致Vue不监听属性的删除：

1. 性能优化：Vue的响应式系统需要为每一个属性建立getter和setter，以及依赖追踪等机制。如果Vue对属性删除也进行响应式绑定，这将导致开销过大，影响性能。

2. 潜在的问题：如果Vue监听属性删除，那么我们删除一个属性时，可能会导致Vue重新渲染整个组件。这可能不是我们所期望的结果，因为属性的删除通常只是组件内部状态的变化，而不需要重新渲染整个组件。

因此，为了避免这些问题，Vue选择不监听属性的删除，而只监听属性的修改。如果我们需要删除一个属性并触发视图更新，可以考虑使用Vue提供的其他方法，比如Vue.set()或this.$set()来替代$delete()方法。这些方法可以在删除属性后手动触发视图更新，以确保视图与数据的同步。

vue2并不会自动监听动态删除的对象属性的变化。这是由于vue2的数据劫持机制是基于Object.defineProperty实现的，只能劫持已经存在的属性。当一个属性被删除后，它就不再存在于对象上，因此无法被劫持和监听。

为了解决这个问题，需要使用Vue.set或$delete方法来删除对象属性。这两个方法可以触发vue的响应式更新机制，实现对删除属性的监听。

具体操作流程如下：

1. 使用Vue.set方法：

// 假设data中有一个obj对象
Vue.set(obj, 'propertyName', null);

在这个例子中，我们将obj对象中的propertyName属性设置为null。这样，Vue会将该属性添加到obj对象上，并自动监听它的变化。

2. 使用$delete方法：

// 假设data中有一个obj对象
Vue.$delete(obj, 'propertyName');

在这个例子中，我们使用$delete方法从obj对象中删除propertyName属性。这个方法会告诉Vue删除该属性，并触发响应式更新机制。

需要注意的是，Vue.set和$delete方法只能用于vue实例的data对象上。如果要删除的属性是在vue实例之外的对象上，Vue无法监听到这个变化。在这种情况下，可以考虑使用Vue.observable方法将这个对象转化为响应式对象。

总结：

在vue2中，删除对象属性不会自动触发vue的响应式更新机制。为了实现对删除属性的监听，可以使用Vue.set或$delete方法来添加或删除属性。这样就可以让vue正常监听到属性的变化并进行更新。如果要删除的属性是在vue实例之外的对象上，可以考虑将这个对象转化为响应式对象。