TYPESCRIPT+VUE.JS前端开发从入门到精通

第 1 章 准备知识 1
1.1 前端技术简介 2
1.2 HTML入门 3
1.2.1 准备开发工具 3
1.2.2 HTML中的基础标签 5
1.3 CSS入门 8
1.3.1 CSS选择器入门 8
1.3.2 CSS样式入门 11
1.4 JavaScript入门 14
1.4.1 我们为什么需要JavaScript 15
1.4.2 JavaScript语法简介 16
1.4.3 从JavaScript到TypeScript 19
1.5 渐进式开发框架Vue 19
1.5.1 **个Vue应用 20
1.5.2 范例：一个简单的用户登录页面 21
1.5.3 Vue 3的新特性 23
1.5.4 我们为什么要使用Vue框架 24
1.6 本章小结 25
第 2 章 TypeScript基础 26
2.1 重新认识TypeScript 26
2.1.1 安装TypeScript 27
2.1.2 TypeScript语言版本的HelloWorld程序 28
2.1.3 使用高级IDE工具 29
2.2 TypeScript中的基本类型 31
2.2.1 布尔、数值与字符串 31
2.2.2 特殊的空值类型 33
2.2.3 数组与元组 34
2.3 TypeScript中有关类型的高级内容 35
2.3.1 枚举类型 35
2.3.2 枚举的编译原理 38
2.3.3 any、never与object类型 39
2.3.4 关于类型断言 40
2.4 函数的声明和定义 41
2.4.1 函数的类型 41
2.4.2 可选参数、默认参数和不定个数参数 42
2.4.3 函数的重载 44
2.5 本章小结 45
第 3 章 TypeScript中的面向对象编程 48
3.1 理解与应用“类” 48
3.1.1 类的定义与继承 48
3.1.2 类的访问权限控制 51
3.1.3 只读属性与存取器 53
3.1.4 关于静态属性与抽象类 55
3.1.5 类的实现原理 57
3.2 接口的应用 58
3.2.1 接口的定义 59
3.2.2 使用接口约定函数和可索引类型 60
3.2.3 使用接口来约束类 62
3.2.4 接口的继承 64
3.3 TypeScript中的类型推断与高级类型 65
3.3.1 关于类型推断 65
3.3.2 联合类型与交叉类型 67
3.3.3 TypeScript的类型区分能力 68
3.3.4 字面量类型与类型别名 70
3.4 本章小结 71
第 4 章 TypeScript编程进阶 73
4.1 使用泛型进行编程 73
4.1.1 泛型的简单使用 73
4.1.2 在类和接口中使用泛型 75
4.1.3 对泛型进行约束 77
4.2 迭代器与装饰器 78
4.2.1 关于迭代器 79
4.2.2 关于装饰器 80
4.2.3 装饰器的组合与装饰器工厂 83
4.3 命名空间与模块 84
4.3.1 命名空间的应用 84
4.3.2 使用模块 86
4.4 本章小结 87
第 5 章 Vue中的模板 88
5.1 模板基础 88
5.1.1 模板插值 89
5.1.2 模板指令 91
5.2 条件渲染 93
5.2.1 使用v-if指令进行条件渲染 93
5.2.2 使用v-show指令进行条件渲染 96
5.3 循环渲染 97
5.3.1 v-for指令的使用方法 97
5.3.2 v-for指令的高级用法 100
5.4 范例：待办任务列表 101
5.4.1 使用HTML搭建应用框架结构 101
5.4.2 实现待办任务列表逻辑 102
5.5 本章小结 104
第 6 章 Vue组件的属性和方法 105
6.1 属性与方法基础 105
6.1.1 属性基础 106
6.1.2 方法基础 106
6.2 计算属性和侦听器 107
6.2.1 计算属性 107
6.2.2 使用计算属或函数 108
6.2.3 计算属性的赋值 109
6.2.4 属性侦听器 110
6.3 进行函数限流 111
6.3.1 手动实现一个简易的限流函数 112
6.3.2 使用Lodash库进行函数限流 113
6.4 表单数据的双向绑定 114
6.4.1 文本输入框 114
6.4.2 多行文本输入区域 115
6.4.3 复选框与单选框 115
6.4.4 选择列表 116
6.4.5 两个常用的修饰符 117
6.5 样式绑定 117
6.5.1 为HTML标签绑定class属性 117
6.5.2 绑定内联样式 119
6.6 范例：用户注册页面 120
6.6.1 搭建用户注册页面 120
6.6.2 实现注册页面的用户交互 123
6.7 本章小结 125
第 7 章 处理用户交互 127
7.1 事件的监听与处理 127
7.1.1 事件监听示例 128
7.1.2 多事件处理 129
7.1.3 事件修饰符 130
7.2 Vue中的事件类型 132
7.2.1 常用的事件类型 132
7.2.2 按键修饰符 134
7.3 实战一：随鼠标移动的小球 135
7.4 实战二：弹球游戏 138
7.5 本章小结 141 第 8 章 组件基础 142
8.1 关于Vue应用与组件 142
8.1.1 Vue应用的数据配置选项 143
8.1.2 定义组件 144
8.2 组件中数据与事件的传递 146
8.2.1 为组件添加外部属性 146
8.2.2 处理组件事件 147
8.2.3 在组件上使用v-model指令 149
8.3 自定义组件的插槽 151
8.3.1 组件插槽的基本用法 151
8.3.2 多具名插槽的用法 153
8.4 动态组件的简单应用 154
8.5 实战：开发一款小巧的开关按钮组件 156
8.6 本章小结 159
第 9 章 组件进阶 160
9.1 组件的生命周期与高级配置 160
9.1.1 生命周期方法 161
9.1.2 应用的全局配置选项 164
9.1.3 组件的注册方式 165
9.2 组件props属性的高级用法 166
9.2.1 对props属性进行验证 166
9.2.2 props的只读性质 169
9.2.3 组件数据注入 170
9.3 组件Mixin技术 173
9.3.1 使用Mixin来定义组件 173
9.3.2 Mixin选项的合并 175
9.3.3 进行全局Mixin 176
9.4 使用自定义指令 177
9.4.1 认识自定义指令 177
9.4.2 自定义指令的参数 178
9.5 组件的Teleport功能 179
9.6 本章小结 181
第 10 章 Vue响应性编程 183
10.1 响应性编程原理与在Vue中的应用 183
10.1.1 手动追踪变量的变化 183
10.1.2 Vue中的响应性对象 186
10.1.3 独立的响应性值Ref的应用 187
10.2 响应式的计算与监听 189
10.2.1 关于计算变量 190
10.2.2 监听响应式变量 191
10.3 组合式API的应用 193
10.3.1 关于setup方法 194
10.3.2 在setup方法中定义生命周期行为 195
10.4 实战：支持搜索和筛选的用户列表示例 196
10.4.1 常规风格的示例工程开发 196
10.4.2 使用组合式API重构用户列表页面 200
10.5 本章小结 202
第 11 章 使用动画 204
11.1 使用CSS 3创建动画 204
11.1.1 transition过渡动画 204
11.1.2 keyframes动画 206
11.2 使用JavaScript的方式实现动画效果 208
11.3 Vue过渡动画 209
11.3.1 定义过渡动画 209
11.3.2 设置动画过程中的监听回调 213
11.3.3 多个组件的过渡动画 214
11.3.4 列表过渡动画 216
11.4 实战：优化用户列表页面 217
11.5 本章小结 219
第 12 章 Vue CLI工具的使用 220
12.1 Vue CLI工具入门 220
12.1.1 Vue CLI工具的安装 221
12.1.2 快速创建Vue项目 222
12.2 Vue CLI项目模板工程 224
12.2.1 模板工程的目录结构 224
12.2.2 运行Vue项目工程 230
12.2.3 vue-class-component库简介 231
12.3 在项目中使用依赖 232
12.4 工程构建 233
12.5 新一代前端构建工具Vite 234
12.5.1 Vite与Vue CLI 235
12.5.2 体验Vite构建工具 235
12.6 本章小结 237
第 13 章 Element Plus基于Vue 3的UI组件库 238
13.1 Element Plus入门 238
13.1.1 Element Plus的安装与使用 239
13.1.2 按钮组件 242
13.1.3 标签组件 244
13.1.4 空态图与加载占位图组件 246
13.1.5 图片与头像组件 249
13.2 表单类组件 251
13.2.1 单选框与多选框 251
13.2.2 标准输入框组件 253
13.2.3 带推荐列表的输入框组件 255
13.2.4 数字输入框 257
13.2.5 选择列表 257
13.2.6 多级列表组件 260
13.3 开关与滑块组件 263
13.3.1 开关组件 263
13.3.2 滑块组件 264
13.4 选择器组件 266
13.4.1 时间选择器 266
13.4.2 日期选择器 268
13.4.3 颜色选择器 269
13.5 提示类组件 270
13.5.1 警告组件 270
13.5.2 消息提示 271
13.5.3 通知组件 273
13.6 数据承载相关组件 274
13.6.1 表格组件 274
13.6.2 导航组件 277
13.6.3 标签页组件 279
13.6.4 抽屉组件 280
13.6.5 布局容器组件 281
13.7 实战：教务系统学生表 283
13.8 本章小结 287
第 14 章 基于Vue的网络框架vue-axios的应用 288
14.1 使用vue-axios请求天气数据 288
14.1.1 使用互联网上免费的数据服务 288
14.1.2 使用vue-axios进行数据请求 291
14.2 vue-axios实用功能介绍 293
14.2.1 通过配置的方式进行数据请求 293
14.2.2 请求的配置与响应数据结构 295
14.2.3 拦截器的使用 296
14.3 实战：天气预报应用 297
14.3.1 搭建页面框架 297
14.3.2 实现天气预报应用核心逻辑 299
14.4 本章小结 301
第 15 章 Vue路由管理 302
15.1 Vue Router的安装与简单使用 302
15.1.1 Vue Router的安装 303
15.1.2 一个简单的Vue Router的使用示例 303
15.2 带参数的动态路由 305
15.2.1 路由参数匹配 305
15.2.2 路由匹配的语法规则 307
15.2.3 路由的嵌套 309
15.3 页面导航 310
15.3.1 使用路由方法 310
15.3.2 导航历史控制 312
15.4 关于路由的命名 312
15.4.1 使用名称进行路由切换 313
15.4.2 路由视图命名 313
15.4.3 使用别名 314
15.4.4 路由重定向 315
15.5 关于路由传参 316
15.6 路由导航守卫 317
15.6.1 定义全局的导航守卫 317
15.6.2 为特定的路由注册导航守卫 318
15.7 动态路由 320
15.8 本章小结 322
第 16 章 Vue状态管理 323
16.1 认识Vuex框架 323
16.1.1 关于状态管理 323
16.1.2 安装与体验Vuex 325
16.2 Vuex中的一些核心概念 328
16.2.1 Vuex中的状态state 328
16.2.2 Vuex中的Getter方法 329
16.2.3 Vuex中的Mutation 331
16.2.4 Vuex中的Action 332
16.2.5 Vuex中的Module 333
16.3 本章小结 337
第 17 章 实战：编程技术论坛系统开发 338
17.1 项目搭建 338
17.1.1 前端项目搭建 338
17.1.2 后端项目搭建 340
17.2 登录注册模块 341
17.2.1 SQLite数据库的应用 341
17.2.2 用户登录注册服务接口实现 344
17.2.3 前端登录注册页面搭建 348
17.2.4 前端登录注册逻辑实现 356
17.3 帖子列表模块的开发 358
17.3.1 类别与帖子数据库表的设计 358
17.3.2 类别列表与帖子列表接口开发 360
17.3.3 前端首页帖子列表模块开发 364
17.4 帖子发布模块开发 370
17.4.1 新增创建帖子的后端服务接口 370
17.4.2 前端发布页面入口添加 372
17.4.3 前端发布帖子页面开发 374
17.4.4 完善帖子发布模块 377
17.5 帖子详情模块开发 379
17.5.1 帖子详情模块后端接口开发 380
17.5.2 前端帖子详情模块开发 382
17.6 评论与回复模块开发 388
17.6.1 评论数据库表的设计与接口逻辑编写 388
17.6.2 前端帖子详情页评论数据展示 394
17.6.3 前端发布评论功能开发 398
17.7 搜索模块与退出登录逻辑开发 400
17.8 本章小结 408