[!info] related notes

• 路线：Vue 学习路线
• 深挖：响应式系统专项对比 · Composition API · Vue 3

Vue2 与 Vue3 差异总览

这个概念为什么出现

团队仍可能维护 Vue2，而新项目默认 Vue3。若只记“有 Composition API”，会低估：响应式边界、生命周期更名、破碎性变更与生态分裂。

[!abstract] 一句话理解 Vue3 用 Proxy 响应式 + Composition 组织方式 + 编译/运行时优化，成为新默认；Vue2 是 Options 与 defineProperty 时代的遗产主线。

对照表

维度	Vue2	Vue3
响应式	Object.defineProperty	Proxy
逻辑组织	Options 为主	Composition + script setup 为主
根 API	new Vue	createApp
多根节点	受限	fragments
TS	体验较弱	显著更好
生态	维护/迁移态	默认新生态

迁移注意

• 全局 API 变应用实例 API
• 生命周期名称变化（destroyed → unmounted 等）
• 过滤器移除，用函数/计算属性
• 部分库只支持其一

学习建议

新学直接 Vue3；维护 Vue2 时补响应式限制（无法检测属性添加等）与 Options 习惯。

本节总结

版本差异是模型升级，不只是 API 换皮。选型与迁移以响应式与组合式主线为中心。

自测题

1. Vue2 响应式对对象新属性的经典限制是什么？

参考答案

defineProperty 预转换已有属性，直接 obj.newKey = 1 可能非响应，需 Vue.set 等（Vue3 Proxy 改善此点）。