零基础学Vue · 课程目录

01 Vue入门

Vue.js简介核心特性MVVM模式框架对比

02 开发环境搭建

Node.js安装npm/yarn配置Vue CLI安装创建第一个项目

03 项目结构解析

目录结构package.jsonmain.js入口App.vue根组件

04 模板语法

插值表达式v-text/v-htmlv-bindv-on

05 数据响应式

data选项methodscomputedwatch侦听器

06 条件渲染

v-ifv-else-ifv-elsev-showv-if vs v-show

07 列表渲染

v-for数组v-for对象key属性数组更新检测

08 事件处理

事件修饰符按键修饰符鼠标修饰符内联处理器

09 表单输入绑定

v-model双向绑定修饰符表单控件绑定

10 Class与Style绑定

对象语法Class数组语法Class内联样式绑定

11 组件基础

全局/局部注册命名规范组件复用

12 组件通信（上）

props父传子$emit子传父v-model通信

13 组件通信（下）

provide/inject$attrs/$listenersEventBusVuex

14 插槽

默认插槽具名插槽作用域插槽默认内容

15 生命周期

生命周期图示beforeCreate/createdbeforeMount/mountedbeforeUpdate/updatedbeforeDestroy/destroyed

16 Vue Router基础

安装与配置router-viewrouter-link命名路由

17 Vue Router进阶

嵌套路由编程式导航路由传参路由守卫

18 Vuex状态管理

核心概念StateGetterMutationActionModule

19 Vuex实战

购物车状态异步操作模块化拆分

20 Axios网络请求

安装与配置GET/POST请求拦截器响应拦截器

21 Vue项目实战（上）

需求分析组件拆分路由设计状态管理设计

22 Vue项目实战（中）

首页开发列表页详情页登录注册

23 Vue项目实战（下）

权限管理错误处理性能优化打包部署

24 Vue 3新特性

Composition APIsetup函数ref/reactivetoRefs

25 Composition API进阶

watchEffectcomputed生命周期钩子自定义Hook

26 Vite构建工具

Vite简介Vite vs Webpack创建Vite项目Vite配置

27 TypeScript与Vue

TypeScript基础组件TS写法类型定义泛型组件

28 单元测试

Jest配置Vue Test Utils组件测试快照测试

29 性能优化

代码分割懒加载虚拟滚动缓存策略SSR简介

30 项目总结与面试

项目亮点提炼常见面试题学习路径规划开源项目推荐