Vue3 系统入门与项目实战【已完结 MK472】

第1章 Vue 语法初探 试看

本章中，将会通过编写实际例子，带你对Vue的语法有个粗浅的认知，让大家结合例子，有一些自己的疑问，从而带着问题继续学习，以便于更好的理解和掌握后面的知识点。

共 5 节 (57分钟) 收起列表

•  1-1 课前须知，这里有你需要了解的一切 (04:34)试看
•  1-2 初学编写 HelloWorld 和 Counter (14:41)
•  1-3 编写字符串反转和内容隐藏小功能 (09:32)
•  1-4 编写TodoList 小功能，了解循环和双向绑定 (11:18)试看
•  1-5 组件概念初探，对 TodoList 进行组件代码拆分 (16:47)

第2章 Vue 基础语法

本章中，将会讲解生命周期函数，指令，模版，数据，侦听器，事件，循环渲染等基础语法知识点，帮助大家理解第一章重写过的代码，同时理解数据驱动的编程思想。

共 16 节 (161分钟) 收起列表

•  2-1 Vue 中应用和组件的基础概念 (09:32)
•  2-2 理解 Vue 中的生命周期函数（1） (10:49)
•  2-3 理解 Vue 中的生命周期函数（2） (12:56)
•  2-4 常用模版语法讲解（1） (09:55)
•  2-5 常用模版语法讲解（2） (08:46)
•  2-6 数据，方法，计算属性和侦听器（1） (15:47)
•  2-7 数据，方法，计算属性和侦听器（2） (06:10)
•  2-8 样式绑定语法 (12:48)
•  2-9 条件渲染 (06:41)
•  2-10 列表循环渲染（1） (11:38)
•  2-11 列表循环渲染（2） (10:45)
•  2-12 事件绑定（1） (13:28)
•  2-13 事件绑定（2） (07:15)
•  2-14 表单中双向绑定指令的使用（1） (07:54)
•  2-15 表单中双向绑定指令的使用（2） (07:22)
•  2-16 表单中双向绑定指令的使用（3） (08:51)

第3章 探索组件的理念

本章中，将会通过对组件概念，以及组件之间代码组织，数据传递的内容讲解，帮助大家完整理解组件的设计理念，让大家能够合理的拆分管理组件，写出易于维护的 Vue 代码。

共 13 节 (141分钟) 收起列表

•  3-1 组件的定义及复用性，局部组件和全局组件（1） (10:19)
•  3-2 组件的定义及复用性，局部组件和全局组件（2） (10:28)
•  3-3 组件间传值及传值校验 (15:41)
•  3-4 单项数据流的理解 (12:37)
•  3-5 Non-Props 属性是什么 (09:34)
•  3-6 父子组件间如何通过事件进行通信（1） (12:32)
•  3-7 父子组件间如何通过事件进行通信（2） (05:26)
•  3-8 组件间双向绑定高级内容（选学） (12:09)
•  3-9 使用插槽和具名插槽解决组件内容传递问题（1） (10:20)
•  3-10 使用插槽和具名插槽解决组件内容传递问题（2） (07:45)
•  3-11 作用域插槽 (08:17)
•  3-12 动态组件和异步组件 (12:20)
•  3-13 基础语法知识点查缺补漏 (12:59)

第4章 Vue 中的动画

本章中，将会通过讲解单元素单组件的动画，与多元素的切换动画，以及状态动画等，帮助大家了解在 Vue 中，如何借助一定的封装，实现 CSS 和 JS 动画，让大家能够快速实现酷炫的动态效果。

共 7 节 (80分钟) 收起列表

•  4-1 使用 Vue 实现基础的 CSS 过渡与动画效果 (14:22)
•  4-2 使用 transition 标签实现单元素组件的过渡和动画效果（1） (13:39)
•  4-3 使用 transition 标签实现单元素组件的过渡和动画效果（2） (12:36)
•  4-4 使用 transition 标签实现单元素组件的过渡和动画效果（3） (13:09)
•  4-5 组件和元素切换动画的实现 (12:12)
•  4-6 列表动画 (07:07)
•  4-7 状态动画 (06:50)

第5章 Vue 中的高级语法 试看

本章中，将会着重介绍 Vue 中混入，插件，自定义指令等扩展语法，以及 render 函数，Teleport 传送门等高级语法，帮助大家更加深入的了解 Vue 原理以及扩展性原则，让大家能够具备一定的高级封装能力。

共 8 节 (93分钟) 收起列表

•  5-1 Mixin 混入的基础语法（1） (07:20)
•  5-2 Mixin 混入的基础语法（2） (15:13)
•  5-3 开发实现 Vue 中的自定义指令（1） (09:47)
•  5-4 开发实现 Vue 中的自定义指令（2） (10:17)
•  5-5 Teleport 传送门功能 (10:11)
•  5-6 更加底层的 render 函数（选学） (15:57)试看
•  5-7 插件的定义和使用 (10:28)
•  5-8 数据校验插件开发实例 (12:54)

第6章 Composition API

本章重，将会给大家全面介绍 Vue3 新提供的 Composition API 语法，帮助大家学会优雅合理的使用新版本 Vue 语法。在本章中，还通过小例子的形式帮助大家进行实操联系，确保大家能够学以致用，为之后的实战课程做好准备。

共 12 节 (119分钟) 收起列表

•  6-1 Setup 函数的使用 (10:13)
•  6-2 ref，reactive 响应式引用的用法和原理（1） (10:49)
•  6-3 ref，reactive 响应式引用的用法和原理 （2） (07:17)
•  6-4 toRef 以及 context 参数（1） (04:11)
•  6-5 toRef 以及 context 参数（2） (10:22)
•  6-6 使用 Composition API 开发TodoList（1） (09:57)
•  6-7 使用 Composition API 开发TodoList（2） (06:45)
•  6-8 computed方法生成计算属性 (10:59)
•  6-9 watch 和 watchEffect 的使用和差异性（1） (11:30)
•  6-10 watch 和 watchEffect 的使用和差异性（2） (10:48)
•  6-11 生命周期函数的新写法 (10:54)
•  6-12 Provide,Inject,模版 Ref 的用法 (14:53)

第7章 Vue 项目开发配套工具讲解

在开发真实大型项目之前，本章中，将会给大家讲解 Vue 配套的一些开发工具的使用方式，包括 VueCLI 脚手架工具的使用，Axios 请求发送库的使用，Vue-Router 路由概念以及 VueX 数据状态管理工具等。通过本章的学习，针对复杂Vue 工程的开发的最后一些难题，大家就可以轻松解决掉啦。…

第8章 “京东到家”项目首页开发

本章中，将会带大家通过首页布局的开发，了解 Vue 基础语法在实战中的使用方法，过程中帮助大家对组件化，组件设计，SCSS 样式编写技巧，BEM CSS 设计模式有更深入的理解。通过本章学习，大家不仅可以完成页面的布局开发，还能学习到很多代码设计的技巧。…

第9章 登陆功能开发

本章中，将会通过登录注册功能的实现，带大家理解路由守卫和更多高级路由使用技巧，帮助大家理解前端登陆鉴权的基本逻辑。同时带领大家深入学习如何Composition API 的新语法上，合理的进行逻辑拆分，增加项目的可维护性，提高大家的工程能力。…

第10章 商家展示功能开发

本章难度明显提升，将会通过商品详情页面与购物车数据的联动功能，讲解在 Vue3 中处理复杂业务逻辑的编码思路，帮助大家深入学习使用了 VueX 以及 Composition API 中各种新语法的实战场景。同时还会讲解路由的异步加载等高级实战内容，是整个实战项目中复杂度最高的一章节。…

第11章 交易链路开发

本章中，将会通过带大家编写购物车和下单页面，帮助进一步了解电商项目的交易流程和涉及到的前端必备技术知识点。