目 录 

第 1章 大觅项目架构设计 1 
任务1 大觅项目业务场景 3 
1.1.1 大觅项目业务分析 4 
1.1.2 大觅项目业务梳理 6 
1.1.3 大觅项目技术栈选型 7 
任务2 大觅项目环境搭建 7 
1.2.1 Node.js的介绍 8 
1.2.2 什么是NPM 9 
1.2.3 安装cnpm 9 
1.2.4 Vue-cli脚手架 10 
1.2.5 上机训练 14 
任务3 前端架构设计 14 
1.3.1 分层架构&模块化 14 
1.3.2 分离方式 15 
1.3.3 Visual Studio Code 免费跨平台编辑器 16 
1.3.4 UI框架 17 
1.3.5 上机训练 20 
1.3.6 构建工具Webpack 20 
1.3.7 上机训练 23 
本章作业 24 
第 2章 大觅项目中ES6的使用 25 
任务1 let和const命令 27 
2.1.1 let命令 27 
2.1.2 上机训练 30 
2.1.3 const命令 30 
任务2 变量的解构赋值 31 
2.2.1 数组的解构赋值 31 
2.2.2 对象的解构赋值 33 
2.2.3 上机训练 34 
任务3 使用箭头函数 34 
2.3.1 箭头函数起因 34 
2.3.2 箭头函数定义 36 
2.3.3 和普通函数的区别 36 
2.3.4 箭头函数不适用场景 38 
任务4 Map数据结构 40 
2.4.1 Map数据结构的特点 40 
2.4.2 如何创建Map 41 
2.4.3 Map常用属性及方法 41 
任务5 Module的语法 44 
2.5.1 概述 44 
2.5.2 export、import命令 44 
2.5.3 export default命令 46 
任务6 Promise对象 46 
2.6.1 Promise的含义 46 
2.6.2 基本用法 47 
本章作业 48 
第3章 大觅项目的路由配置 49 
任务1 什么是前端路由 50 
3.1.1 什么是路由 50 
3.1.2 前端路由 51 
3.1.3 前端路由的使用场景 51 
任务2 Vue Router基本使用 52 
3.2.1 安装路由 52 
3.2.2 建立路由器模块 53 
3.2.3 启动路由器 53 
3.2.4 路由重定向 54 
3.2.5 路由懒加载 55 
3.2.6 56 
3.2.7 路由对象属性 57 
任务3 页面间导航 57 
3.3.1 router.push 58 
3.3.2 router.replace 58 
3.3.3 router.go 58 
本章作业 59 
第4章 初识Vue.js 61 
任务1 Vue.js是什么 62 
4.1.1 MVVM模式 63 
4.1.2 Vue.js的开发模式 63 
4.1.3 单文件组件 64 
任务2 Vue实例与数据绑定 65 
4.2.1 实例与数据 65 
4.2.2 插值表达式 66 
4.2.3 生命周期 68 
任务3 class与style绑定 71 
4.3.1 了解v-bind指令 71 
4.3.2 绑定class的方式 72 
4.3.3 绑定内联样式 76 
本章作业 77 
第5章 大觅项目中与服务端通信 79 
任务1 connect-mock-middleware工具的使用 81 
5.1.1 添加middleware 81 
5.1.2 写mock文件 81 
任务2 Mock.js语法 84 
5.2.1 Mock.js基本介绍 84 
5.2.2 Mock.js语法规范 84 
任务3 snail mock工具使用 87 
任务4 Axios的安装及配置 88 
5.4.1 Axios基本介绍 88 
5.4.2 Axios安装使用 88 
5.4.3 Axios封装及调用 90 
5.4.4 请求设置 90 
5.4.5 返回响应概要 91 
5.4.6 拦截器 92 
5.4.7 上机训练 93 
任务5 大觅项目的服务端通信配置 93 
本章作业 93 
第6章 Vue.js指令 95 
任务1 条件渲染指令 96 
6.1.1 v-if指令 97 
6.1.2 v-else指令 97 
6.1.3 v-show指令 98 
6.1.4 v-if与v-show的选择 99 
任务2 列表渲染v-for指令 100 
6.2.1 基本用法 100 
6.2.2 遍历对象 100 
6.2.3 遍历数组 101 
6.2.4 key属性 102 
6.2.5 上机训练 102 
任务3 方法与事件 103 
6.3.1 v-on指令 103 
6.3.2 修饰符 106 
任务4 v-model与表单 108 
6.4.1 基本用法 108 
6.4.2 修饰符 109 
本章作业 109 
第7章 组件详解 113 
任务1 组件概念与复用 114 
7.1.1 为什么使用组件 114 
7.1.2 组件的复用 115 
任务2 使用props传递数据 115 
7.2.1 基本用法 115 
7.2.2 单向数据流 119 
7.2.3 上机训练 121 
任务3 组件通信 121 
7.3.1 自定义事件及$emit方法 121 
7.3.2 兄弟组件通信的处理方式 123 
任务4 slot分发内容 126 
7.4.1 什么是slot 126 
7.4.2 匿名slot 126 
7.4.3 具名slot 128 
本章作业 129 
第8章 计算属性和侦听器 131 
任务1 计算属性 132 
8.1.1 什么是计算属性 132 
8.1.2 计算属性用法 134 
8.1.3 计算属性缓存 137 
8.1.4 上机训练 139 
任务2 侦听器 139 
8.2.1 什么是侦听器 139 
8.2.2 计算属性vs侦听器 140 
本章作业 143 
第9章 大觅项目中插件的使用 145 
任务1 百度地图插件 146 
9.1.1 百度地图基本介绍 146 
9.1.2 百度地图基本使用 147 
9.1.3 上机训练 150 
任务2 状态管理与Vuex 151 
9.2.1 状态管理与使用场景 151 
9.2.2 Vuex基本用法 152 
任务3 二维码插件 156 
9.3.1 使用场景 156 
9.3.2 QRCode插件使用 156 
本章作业 157 
第 10章 大觅项目总结 159 
任务1 大觅项目起步 160 
10.1.1 项目前期准备 160 
10.1.2 Vue框架 162 
任务2 梳理大觅项目技能点 162 
10.2.1 项目框架搭建及配置 162 
10.2.2 梳理项目技能点 163 
本章作业 168