对象响应

本节目标：理解“对象响应”的核心思路，并能把它用于实际开发或面试表达。 在 Vue 3 中，当你将一个对象传递给 ref 时，会发生以下情况：

1. 深度监听：
   • 是的，ref 会对传递的对象进行深度响应式转换。Vue 3 使用 reactive 内部机制（基于 Proxy）来处理对象类型的 ref 值。
   • 这意味着对象的所有嵌套属性都会被深度监听，任何属性的修改（包括嵌套对象的属性）都会触发响应式更新。
2. 修改属性值的影响：
   • 如果你修改 ref 对象的某个属性值（如 obj.key = newValue 或 obj.nested.key = newValue），Vue 会检测到变化，并触发相关响应式副作用（如重新渲染组件、触发 watch 回调等）。
   • 这种行为与直接使用 reactive 创建的对象类似，区别在于 ref 需要通过 .value 访问，而 reactive 直接操作对象。
3. 注意事项：
   • 直接替换整个对象：如果你替换整个 ref 的值（ref.value = newObj），Vue 也会检测到变化，但新对象会再次被转换为响应式对象。
   • 非响应式数据：如果对象中某些属性被标记为非响应式（如使用 markRaw），这些属性不会触发更新。
   • 性能考虑：深度监听可能对大型复杂对象有性能影响。如果只需要监听特定属性，考虑使用 shallowRef（仅监听 .value 的变化，不深度监听对象内部）。