简述Vue.set 方法原理 ？
参考回答
Vue.set 是 Vue 提供的一个方法，用于向响应式对象中添加新的属性或者修改数组中的元素，并且能够触发视图的更新。由于 Vue 不能检测到直接添加新属性或者修改数组元素的操作，所以我们使用 Vue.set 来确保新属性或数组元素能被响应式系统监听到，从而实现视图的更新。
详细讲解与拓展
- 原理：
- Vue.js 采用的是数据劫持（Data Hijacking）和依赖追踪（Dependency Tracking）的方式来实现响应式。当我们直接修改对象的某个已有属性时，Vue 会自动侦测到并更新视图。然而，如果我们直接给对象添加新属性或修改数组的元素（例如使用
obj.newProp = value或arr[index] = value），Vue 不能检测到这些变更。 - 这是因为 JavaScript 的对象和数组的属性都是在创建时确定的，而 Vue 的响应式系统是基于
Object.defineProperty（Vue 2.x）来实现的，而Object.defineProperty只能劫持已有属性，对新添加的属性无法劫持。
- Vue.js 采用的是数据劫持（Data Hijacking）和依赖追踪（Dependency Tracking）的方式来实现响应式。当我们直接修改对象的某个已有属性时，Vue 会自动侦测到并更新视图。然而，如果我们直接给对象添加新属性或修改数组的元素（例如使用
Vue.set的作用：Vue.set可以动态地添加新的属性到对象中，并且能够确保 Vue 的响应式系统能够侦测到这个新属性，触发视图更新。- 对于数组，
Vue.set会确保更新数组时能够正确地触发视图更新。数组在 Vue 中是一个特殊的对象，它并不通过普通的Object.defineProperty进行数据劫持，而是通过Array的原型方法来进行响应式处理。而Vue.set能够确保数组元素的变更能够正确反应到视图中。
- 用法：
Vue.set的基本用法是：Vue.set(obj, property, value)，它会向对象obj中添加或修改属性property，并确保该属性是响应式的。- 对于数组：
Vue.set(arr, index, value)用于设置数组的某个索引位置的值，确保视图更新。
示例：
// 向对象中添加新属性 Vue.set(this.obj, 'newProp', 'newValue'); // 修改数组中的元素 Vue.set(this.arr, 0, 'newValue'); - 为什么需要
Vue.set：- 如果直接使用
obj.newProp = value或arr[index] = value，Vue 不会侦测到这些属性或元素的变化，视图不会更新。 Vue.set是通过Object.defineProperty动态添加新的响应式属性或更新数组元素，保证 Vue 能够侦测到变化并更新视图。
- 如果直接使用
- Vue 3 中的变化：
- 在 Vue 3 中，Vue 改用
Proxy来实现响应式系统，Proxy能够更好地处理属性的添加和删除，因此不再需要Vue.set。在 Vue 3 中，直接添加新属性或修改数组元素都会自动触发视图更新。
- 在 Vue 3 中，Vue 改用
总结
Vue.set 是为了弥补 Vue 2.x 中响应式系统的不足，确保新添加的属性或者修改数组元素时，能够触发视图更新。它是通过动态添加 getter/setter 来实现数据的劫持，确保新属性和数组元素能够被 Vue 的响应式系统所追踪。在 Vue 3 中，由于引入了 Proxy，不再需要 Vue.set，因为 Proxy 可以自动处理对象的属性和数组元素的变化。