[!info] related notes

• 所属 MOC: Vue MOC
• 主题入口: vue3
• 面试桥接: vue-interview-high-frequency

Vue学习路线图

学 Vue 最怕的不是内容多，而是顺序乱。只要把组件、响应式、组合式 API 和工程生态按层次接起来，很多零散 API 都会自然归位。

推荐顺序

第一阶段：先建立组件心智

先理解 Vue 是如何用模板和组件描述界面的。

• vue3
• vue3-lifecycle
• vue3-slots
• vue-component-communication
• vue-conditional-and-list-rendering

第二阶段：再理解响应式系统

这一层决定你是否真正理解 Vue3 的核心机制。

• Vue 响应式系统
• React 状态模型 vs Vue3 响应式模型
• Vue中的ref和reactive
• vue-computed
• Vue中的watch和watchEffect
• vue-computed-vs-watch-interview-question
• vue-watch-vs-watch-effect-interview-question
• vue-next-tick

第三阶段：掌握 Composition API

学会如何组织逻辑，比单纯记住 API 更重要。

• Vue Composition API
• vue-component-design-principles
• Vue中的props和emit
• Vue中的provide和inject
• vue-v-model
• vue-define-model-interview-question
• vue-define-model-vs-props-and-emit-selection-interview-question

第四阶段：进入工程层

这一步开始理解中大型应用是怎么搭起来的。

• 路由
• vue-router
• vue-router-guards-and-permission-control
• vue-router-module-design
• pinia
• pinia-store-design-patterns
• vue-component-communication-selection-interview-question

第五阶段：补渲染与性能认知

这一层适合在你已经会写页面之后回头补。

• vue-render-and-update-flow
• vue3-virtual-dom
• vue3-performance-optimization

一条实用学习原则

不要一开始就追着组件库、脚手架和面经跑。先把组件、响应式和状态流转讲清楚，再去学路由、状态管理和性能，成本最低。

一条对照学习建议

如果你同时在学 React 和 Vue，建议把这一篇和 react-learning-roadmap 配合看。

最值得对照的不是 API 名字，而是：

• React 的 state snapshot / 更新队列
• Vue 的依赖追踪 / track / trigger

这条线继续看：React 状态模型 vs Vue3 响应式模型

如果是面试导向

学完上面主线后，可以直接进入 vue-interview-high-frequency，把高频问题按主题重新串起来。

Related notes

• Vue MOC