本书是一本系统性讲解Vue.js开发技术的教材,以通俗易懂的语言、丰富实用的案例,帮助初学者快速掌握Vue.js,能够运用Vue.js开发Web前端项目。
全书共8章。第1章讲解Vue.js的基本概念以及项目的创建;第2~5章讲解Vue.js开发基础、组件、路由等知识;第6章讲解常用UI组件库,包括Element Plus、Vant和Ant Design Vue;第7章讲解网络请求与状态管理,包括Axios、Vuex和Pinia;第8章讲解“微商城”项目开发实战。
本书适合作为高等院校本、专科计算机相关专业的教材,也可作为广大计算机编程爱好者的参考书。
本书针对想要从事Web前端开发相关工作,已经具备了HTML5、CSS3、JavaScript的基础知识,但是没有Vue.js基础或基础比较薄弱的人群。本书详细讲解了Vue.js开发技术,涵盖组件、路由、常用UI组件库、网络请求和状态管理等内容,尽可能地确保读者可以学以致用,具备解决实际问题的能力。
本书根据知识的难易程度,采用先易后难的方式部署教材章节顺序。在知识讲解时以环环相扣的推进方式阐述出每个技术的作用以及相互之间的联系。并通过实用的案例和项目,帮助读者提高对Vue.js的整体认识,积累开发经验。
第1章 初识Vue.js 1.1 前端技术的发展 1.2 Vue简介 1.2.1 什么是Vue 1.2.2 Vue的特性 1.2.3 Vue的版本 1.3 Vue开发环境 1.3.1 Visual Studio Code编辑器 1.3.2 Node.js环境 1.3.3 常见的包管理工具 1.4 使用Vite创建Vue 3项目 1.4.1 什么是Vite 1.4.2 创建Vue 3项目 1.4.3 Vue 3项目的目录结构 1.4.4 Vue 3项目的运行过程 本章小结 课后习题 第2章 Vue.js开发基础 2.1 单文件组件 2.2 数据绑定 2.2.1 初识数据绑定 2.2.2 响应式数据绑定 2.3 指令 2.3.1 内容渲染指令 2.3.2 属性绑定指令 2.3.3 事件绑定指令 2.3.4 双向数据绑定指令 2.3.5 条件渲染指令 2.3.6 列表渲染指令 2.4 事件对象 2.5 事件修饰符 2.6 计算属性 2.7 侦听器 2.8 样式绑定 2.8.1 绑定class属性 2.8.2 绑定style属性 2.9 阶段案例——学习计划表 本章小结 课后习题 第3章 组件基础(上) 3.1 选项式API和组合式API 3.2 生命周期函数 3.3 组件的注册和引用 3.3.1 注册组件 3.3.2 引用组件 3.4 解决组件之间的样式冲突 3.5 父组件向子组件传递数据 3.5.1 声明props 3.5.2 静态绑定props 3.5.3 动态绑定props 3.5.4 验证props 3.6 子组件向父组件传递数据 3.6.1 在子组件中声明自定义事件 3.6.2 在子组件中触发自定义事件 3.6.3 在父组件中监听自定义事件 3.7 跨级组件之间的数据传递 3.8 阶段案例——待办事项 本章小结 课后习题 第4章 组件基础(下) 4.1 动态组件 4.1.1 定义动态组件 4.1.2 利用KeepAlive组件实现组件缓存 4.1.3 组件缓存相关的生命周期函数 4.1.4 KeepAlive组件的常用属性 4.2 插槽 4.2.1 什么是插槽 4.2.2 具名插槽 4.2.3 作用域插槽 4.3 自定义指令 4.3.1 什么是自定义指令 4.3.2 私有自定义指令的声明与使用 4.3.3 全局自定义指令的声明与使用 4.3.4 为自定义指令绑定参数 4.3.5 自定义指令的函数形式 4.4 引用静态资源 4.5 阶段案例——商品管理 本章小结 课后习题 第5章 路由 5.1 初识路由 5.2 初识Vue Router 5.2.1 Vue Router的安装 5.2.2 Vue Router的基本使用 5.3 路由重定向 5.4 嵌套路由 5.5 动态路由 5.5.1 动态路由概述 5.5.2 获取动态路径参数 5.6 命名路由 5.7 编程式导航 5.8 导航守卫 5.9 阶段案例——后台管理系统 本章小结 课后习题 第6章 常用UI组件库 6.1 Element Plus组件库 6.1.1 安装Element Plus 6.1.2 Element Plus中的常用组件 6.2 Vant组件库 6.2.1 安装Vant 6.2.2 Vant中的常用组件 6.3 Ant Design Vue组件库 6.3.1 安装Ant Design Vue 6.3.2 Ant Design Vue中的常用组件 本章小结 课后习题 第7章 网络请求和状态管理 7.1 Axios 7.1.1 Axios概述 7.1.2 安装Axios 7.1.3 使用Axios 7.1.4 Axios图书列表案例 7.2 Vuex 7.2.1 Vuex概述 7.2.2 安装Vuex 7.2.3 使用Vuex 7.2.4 Vuex计数器案例 7.3 Pinia 7.3.1 Pinia概述 7.3.2 安装Pinia 7.3.3 使用Pinia 7.3.4 Pinia计数器案例 7.3.5 Pinia模块化 7.3.6 Pinia持久化存储 本章小结 课后习题 第8章 项目实战——“微商城”前后台开发 8.1 项目分析 8.1.1 项目前台分析 8.1.2 项目后台分析 8.2 项目开发说明 本章小结