【重磅】Vue3 + TS 新书来了！

考拉🐨 送福利啦【第27期】

为反馈广大读者粉丝们的大力支持，号主特地选了 

4本Vue.js 3+TypeScript完全指南 和 10 个现金红包作为抽奖礼品。

具体参与方式请看 文末！文末！文末！

初学前端技术的同学们，大多会在看书、看资料的同时，在网上找一些视频课程，比如Vue.js、TypeScript、React等方面的课程，跟随老师的讲解逐步学习。

提到前端技术视频课程，就不得不提到该领域中一位极具知名度的大佬——coderwhy。

Coderwhy（王红元）老师在很多教学平台上开设了前端相关的课程，比如腾讯课堂、b站等等，他的视频课程多样，线上线下学员众多，课程播放量客观，而且收获了许多良好的评价和反馈。

在一些内容平台上，我们还能看到有很多学员在学习了coderwhy老师的课程之后，精心总结了学习笔记，分享了自己的学习路线和经验等。

但对于想要系统前端学习的同学来说，只看视频课程或者其他学员的总结笔记，显然无法满足需要。

• 一是因为观看视频课程对周围环境的要求较高，无法利用碎片化时间学习，且记录起来不方便；

• 二是毕竟是出自他人之手的总结笔记，其中的知识点相对零散，而且他人的经验未必适合自己。

很多看过coderwhy老师视频课的同学们，希望能有一本全面、系统的前端学习资料，对视频课中的知识进行整理完善，这样学习起来更加方便，也便于记录。

好消息来啦——coderwhy老师真的出书啦！

coderwhy老师的首本技术著作

就是它——《Vue.js 3+TypeScript完全指南》 ！

我们都知道，Vue.js诞生于2014年，是由Evan You开源的轻量级前端框架。相比于React和Angular框架，Vue.js显得更加轻量级、简单，更容易理解和上手。Vue.js的简单易用和高效性使其成为开发者首选的框架之一。

2016年10月，Evan You发布Vue.js 2.0版本。2020年9月，Evan You对Vue.js 2进行重构，并发布Vue.js 3版本。Vue.js 3具有非常多的新特性，其中最重要的变化是使用TypeScript进行重构。

这使得Vue.js 3更加易于开发和维护，也更加符合现代开发规范。

此外，Vue.js 3还引入了Proxy进行数据劫持和Composition API等，这些新特性可以使开发者更加轻松地编写高质量的代码。

随着企业对Vue.js 3 + TypeScript的需求不断增加，越来越多的企业开始使用这种技术开发Web应用程序。

例如，Element Plus、Ant Design Vue和Vant等都已经全面支持Vue.js 3 + TypeScript开发。这说明Vue.js 3 + TypeScript已经成为现代Web开发的核心技术之一。

然而，目前市场上还没有一本全面、系统介绍Vue.js 3 + TypeScript的入门教材，这使很多初学者感到困难重重。

因此，本书的写作初衷是为读者提供系统级的学习体验，旨在帮助读者全面掌握Vue.js 3和TypeScript的使用和原理，提高前端开发水平。

本书主要内容

本书是一本全面、深入介绍Vue.js 3和TypeScript前端开发技术的图书。

全书共包含19章，576页。

书中详细介绍了Vue.js 3的新特性与优势，包括模板语法、内置指令、Options API、组件化、过渡动画、Composition API、Vue Router、Vuex 等核心知识点；TypeScript 的基础和进阶知识，包括数据类型、类型别名、联合类型、类型断言、函数类型、类、接口、泛型、类型声明等内容。此外，本书还深入探讨了前端工程化、第三方库的集成与使用、企业级管理后台的实现和自动化部署等内容，以及如何从零开始实现一个Mini-Vue.js 3框架，以便读者深入理解Vue.js 3的核心原理。

本书的完整目录如下，请滑动观看。

向上滑动阅览

1 邂逅和初体验Vue.js 1

1.1 认识Vue.js

1.2 Vue.js与其他框架的对比

1.3 Vue.js 2的缺点

1.4 Vue.js 3带来的新变化

1.5 搭建开发环境

1.6 Vue.js 3的安装和使用

1.7 计数器案例

1.8 createApp的对象参数

1.9 VS Code生成代码片段

2 模板语法和内置指令 28

2.1 插值语法

2.2 基本指令

2.3 v-bind

2.4 v-on

2.5 条件渲染

2.5.4 v-show和v-if的区别

2.6 列表渲染

2.6.4 数组的更新检测

2.7 key和diff算法

3 Vue.js 3的Options API 65

3.1 计算属性

3.2 监听器watch

3.3 案例：书籍购物车

4 v-model和表单输入 89

4.1 基本使用

4.2 实现原理

4.3 绑定其他表单

4.4 v-model值的绑定

4.5 修饰符

4.5.1 .lazy修饰符

4.5.2 .number修饰符

4.5.3 .trim修饰符

4.6 v-model在组件上的使用

5 Vue.js 3组件化开发 97

5.1 认识组件化

5.2 Vue.js 3的组件化

5.3 注册组件

5.4 Vue.js 3开发模式

5.5 Vue.js 3支持SFC

6 前端工程化 107

6.1 前端快速发展史

6.2 认识webpack

6.3 Vue CLI脚手架

6.4 认识Vite

6.5 create-vue 脚手架

6.6 webpack和Vite的区别

7 Vue.js 3组件化基础详解 128

7.1 组件的嵌套

7.1.1 搭建基本页面

7.1.2 组件的拆分和嵌套

7.1.3 组件CSS的作用域

7.1.4 组件之间的通信

7.2 组件样式的特性

7.2.1 Scoped CSS

7.2.2 CSS Modules

7.2.3 在CSS中使用v-bind

7.3 父子组件的相互通信

7.3.1 父组件传递数据给子组件

7.3.2 子组件传递数据给父组件

7.3.3 案例：选项卡TabControl实战

7.4 非父子组件的相互通信

7.4.1 Provide/Inject依赖注入

7.4.2 全局事件总线

7.5 组件中的插槽

7.6 组件的作用域插槽

7.6.1 认识渲染作用域

7.6.2 作用域插槽

7.6.3 独占默认插槽

8 Vue.js 3组件化进阶详解 173

8.1 动态组件

8.1.1 v-if指令的实现

8.1.2 动态组件的实现

8.1.3 动态组件的传参

8.1.4 keep-alive的使用

8.2 异步组件

8.2.1 webpack对代码分包

8.2.2 在Vue.js 3中实现异步组件

8.2.3 异步组件和Suspense

8.3 获取元素或组件的实例

8.3.1 $refs

8.3.2 $parent

8.4 组件生命周期函数

8.5 在组件中使用v-model指令

8.5.1 v-model的基本使用方法

8.5.2 v-model绑定computed

8.5.3 组件上应用多个v-model

8.5.4 v-model绑定对象类型

9 Vue.js 3实现过渡动画 201

9.1 基本过渡动画

9.1.1 认识过渡动画

9.1.2 过渡动画特有的类

9.1.3 CSS的Animation动画

9.1.4 Transition组件的常见属性

9.2 第三方库动画库

9.2.1 Animate.css动画库

9.2.2 GSAP动画库

9.3 列表中的过渡动画

9.3.1 TransitionGroup的基本使用

9.3.2 列表元素的过渡动画

9.3.3 案例：列表元素的交替过渡

10 Vue.js 3 Composition API详解 224

10.1 Options API代码的复用

10.1.1 Mixin混入

10.1.2 extends继承

10.2 认识Composition API

10.3 setup函数的基本使用

10.3.1 参数

10.3.2 返回值

10.3.3 this

10.4 数据响应式API

10.4.1 reactive

10.4.2 ref

10.5 响应式工具reactive

10.6 响应式工具ref

10.7 computed计算属性

10.7.1 基本使用

10.7.2 get和set方法

10.8 watchEffect监听

10.8.1 基本使用

10.8.2 停止听

10.8.3 清除副作用

10.8.4 执行时机

10.9 watch监听

10.9.1 监听单个数据源

10.9.2 监听多个数据源

10.9.3 监听响应式对象

10.10 组件生命周期函数

10.11 Provide/Inject依赖注入

10.11.1 提供数据

10.11.2 注入数据

10.11.3 提供和注入响应式数据

10.12 案例：Composition API的实战

10.12.1 计数器的两种实现方式

10.12.2 代码逻辑的封装和复用

10.12.3 修改网页的标题

10.12.4 监听页面滚动位置

10.13

本书特色

（1）丰富的实战案例：本书涵盖多个实际开发场景，如书籍购物车、计数器、自定义Hooks实战、自定义指令、自定义插件、列表动画、柱状图、折线图、饼图、后台管理系统等。这些案例涉及Vue.js 3的各个方面，可以帮助读者在实践中掌握Vue.js 3的核心概念和技能。

（2）深入剖析原理：本书不仅介绍了Vue.js 3的使用方式和技巧，还深入剖析了其原理和实现方式。例如，methods中this的指向、虚拟DOM、diff算法、nextTick的原理，并实现了一个Mini-Vue.js 3框架，帮助读者深入理解Vue.js 3的内部机制。

（3）各种实用工具：本书介绍了多种实用工具，如VS Code常用的插件、snippet代码片段生成、Vue.js devtools、Vue CLI、create-app、ESLint、Prettier等。这些工具可以帮助读者提高开发效率和代码质量。

（4）适合不同层次读者：本书内容适合从初学者到高级前端开发工程师等各个层次的读者。无论是前端开发工程师、Web开发者、学生，还是从Vue.js 2转向Vue.js 3的读者，都可以从本书中获得实用的知识和技能。

（5）最新的技术栈：本书使用最新的技术栈，如 Vue.js 3、Element Plus、ECharts 5.x、TypeScript、axios、Vue Router、Vuex等，帮助读者了解最新的前端开发技术和趋势。

（6）知识点覆盖全面：本书囊括了Vue.js 3的模板语法、内置指令、Options API、组件化、过渡动画、Composition API、Vue Router、Vuex、TypeScript、前端工程化、常用的第三方库、项目实战、自动化部署，以及从零实现一个Mini-Vue.js 3框架等内容，帮助读者全面掌握Vue.js 3的相关知识和技能。

（7）封装与架构思想：本书介绍了项目中的各种组件封装技巧、axios请求库的封装、Vue Router 的封装、Vuex 的封装，以及后台管理系统架构等。这些内容可以帮助读者学习封装和架构思想，提高代码的可维护性和可扩展性。

（8）自动化部署（CI/CD）：本书介绍了DevOps开发模式、购买服务器、手动部署、自动化部署等内容。这些内容可以帮助读者了解自动化部署的流程和工具，提高项目的交付效率和质量。

一些实用的学习建议

这是一本全面、深入介绍Vue.js 3和TypeScript前端开发技术的图书，重点介绍Vue.js 3和TypeScript的核心概念、技术原理和实战应用，以帮助读者成为一名优秀的前端开发工程师。

以下是为读者提供的一些学习建议。

（1）先学习基础知识：对于没有前端开发经验的读者，建议先学习一些基础知识，例如HTML、CSS和JavaScript。这些基础知识对学习Vue.js 3和TypeScript来说非常重要。

（2）系统性学习：本书是一本系统性学习指南，建议读者按照章节顺序学习，不要跳跃式阅读。在学习的过程中，建议一边阅读，一边动手实践，以便加深理解；建议多写学习笔记，方便后续复习和总结。

（3）动手练习：学习Vue.js 3和TypeScript最好的方法是动手练习。建议读者在阅读每个章节时，都亲自动手练习，切忌纸上谈兵，这样才能更好地理解概念。

（4）查看示例代码：书中的示例代码是非常有用的，有助于读者更好地理解概念和实现。在阅读每个章节时，请务必查看示例代码。完整的示例代码可以查看本书提供的源代码，下载方式见本书封底的“读者服务”。

（5）项目实战练习：学习Vue.js 3和TypeScript不仅是学习理论知识，而且需要通过实战项目的练习来加深理解。建议读者跟随书中内容，逐步动手实现本书提供的一个后台管理系统的项目，提升自己的编程能力。

（6）参考官方文档：Vue.js 3和TypeScript都有完整的官方文档，可以帮助我们更深入地了解其特性和用法。在阅读每个章节时，如果想要了解更多的信息，可以参考官方文档。

（7）观看配套视频：本书涉及的知识面非常广，如果阅读时对某些知识点有疑惑或难以理解，可以观看专为本书定制的视频教程。视频教程可以在本书读者群中获取，进群方式见封底的“读者服务”。

总之，学习Vue.js 3和TypeScript需要耐心、毅力、勤于实践，希望本书能成为各位读者学习Vue.js 3和TypeScript的有力工具和高效指南！

↑限时五折优惠↑ 

抽奖送书活动规则奖品设置：
《Vue.js 3+TypeScript完全指南》 书籍4本
开奖时间：11 月 14   21：30 点开奖

设置了两种参与方式，在看抽奖和朋友圈点赞，都可以参与下哦

在看抽奖（2本实体书+6个幸运5元红包）

• 大奖：随机抽取「2位」在看同学各送出一本 《Vue.js 3+TypeScript完全指南》书籍

• 幸运奖：随机抽取「6位」在看同学各送一个小红包 

点在看的小伙伴记得添加我微信哦，不然我看不到哪些小伙伴点在看了。

在看抽奖方法：随机抽2名送书，6名红包，中奖者我会私聊你的。

朋友圈点赞（幸运楼层送2本实体书+4个幸运5元红包）扫描下方我微信二维码，先添加我为好友，我明天会在朋友圈发布点赞送书活动，在朋友圈点赞即可参与～

   “分享、点赞、在看” 支持一波