第1章 Web开发基础
1.1 Web开发基础
1.1.1Web 1.0时代
1.1.2Web 2.0时代
1.2 Web开发模式
1.2.1 MVC
1.2.2 MVP
1.2.3 MVVM
1.3 Vue简介
1.3.1 Vue的开发模式
1.3.2 Vue的安装
1.4 开发工具的使用
1.4.1 VS Code
1.4.2 Vue.js Devtools插件
1.5 第一个Vue程序
1.5.1 编写Vue程序
1.5.2 通过浏览器运行程序习题与实践
第2章 Vue基础
2.1 Vue实例
2.1.1 创建Vue实例及挂载
2.1.2 Vue数据与方法
2.2 计算属性和侦听属性
2.2.1 计算属性
2.2.2 侦听属性
2.3 事件
2.3.1 事件监听及事件处理
2.3.2 事件修饰符
2.3.3 按键修饰符
2.4 Vue生命周期
2.4.1 生命周期钩子函数
2.4.2 生命周期钩子函数实例习题与实践
第3章 Vue数据绑定
3.1 Vue模板语法
3.1.1 模板语法
3.1.2 v-text
3.1.3 v-html
3.2 v-bind
3.2.1 class属性绑定
3.2.2 style属性绑定
3.3 条件渲染
3.3.1 v-show
3.3.2 v-if
3.3.3 v-else
3.3.4 v-else-if
3.4 v-for
3.4.1 v-for
3.4.2 双重v-for
3.5 v-model
3.5.1 绑定文本框
3.5.2 绑定单选按钮
3.5.3 绑定复选框
3.5.4 绑定列表框
3.5.5 绑定修饰符
3.6 自定义指令
3.6.1 自定义指令构成
3.6.2 动态指令参数
3.7 购物车案例
3.7.1 案例说明
3.7.2 案例分析与实施
习题与实践
第4章 Vue组件
4.1 组件的定义与使用
4.1.1 注册全局组件
4.1.2 注册局部组件
4.1.3 .vue文件
4.2 组件通信
4.2.1 父组件给子组件传递信息
4.2.2 子组件给父组件传递信息
4.3 插槽的使用
4.3.1 单个插槽
4.3.2 具名插槽
4.3.3 作用域插槽
4.4 简易留言板案例
4.4.1 案例说明
4.4.2 案例分析与实施
4.4.3 源代码
习题与实践
第5章 vue-router路由
5.1 前端路由
5.1.1 vue-router的引入
5.1.2 vue-router基础用法
5.1.3 路由重定向
5.2 动态路由
5.2.1 query方式传参
5.2.2 params方式传参
5.3 嵌套路由
5.3.1 嵌套路由基础
5.3.2 嵌套路由的实现
5.4 命名路由和命名视图
5.4.1 命名路由
5.4.2 命名视图
5.5 编程式导航
5.5.1 push()方法
5.5.2 replace()方法
5.5.3 go()方法
习题与实践
第6章 Vue项目构建
6.1 项目脚手架vue-cli
6.1.1 安装vue-cli
6.1.2 使用vuecreate创建项目
6.1.3 项目初始目录结构
6.2 Vant插件
6.2.1 安装Vant插件
6.2.2 引入组件
6.2.3 使用Vant组件
6.3 Axios
6.3.1 Axios基础
6.3.2 在Vue单文件中使用Axios
6.3.3 Axios在Vue项目中的使用
6.3.4 Axios封装及调用
习题与实践
第7章 组合式API
7.1 组合式API简介
7.1.1 组合式API的入口函数
7.1.2 ref与reactive函数
7.1.3 toRefs函数
7.2 computed、watch和watchEffect
7.2.1 computed函数
7.2.2 watch和watchEffect
7.3 provide和inject
7.3.1 provide/inject使用方式
7.3.2 provide/inject实例
7.4 组合式API生命周期
7.4.1 组合式API生命周期钩子函数
7.4.2 组合式API生命周期钩子函数示例
习题与实践
第8章 Vuex状态管理
8.1 Vuex概述
8.1.1 状态管理模式
8.1.2 Vuex教据状态管理
8.1.3 Vuex基本使用
8.2 Vuex中的配置选项
8.2.1 State
8.2.2 Getters
8.2.3 Mutations
8.2.4 Actions
8.2.5 Modules
习题与实践
第9章 综合案例开发1——万家水果APP
9.1 项目前期准备工作
9.1.1 项目创建及插件安装
9.1.2 准备数据
9.1.3 项目目录
9.2 公共组件的设计与制作
9.2.1 头部组件
9.2.2 轮播图组件
9.2.3 导航组件
9.3 main.js、app.vue及router/index.js项目文件
9.3.1 main.js
9.3.2 app.vue
9.3.3 router/index.js
9.4 首页组件(index.vue)
9.5 商品页组件(goods.vue)
9.5.1 商品页组件(goods.vue)结构代码
9.5.2 商品页组件(goods.vue)逻辑代码
9.6 购物车组件(cart.vue)
9.6.1 购物车组件(cart.vue)结构代码
9.6.2 购物车组件(cart.vue)逻辑代码
9.7 订单组件(order.vue)
9.7.1 订单组件(order.vue)结构代码
9.7.2 订单组件(order.vue)逻辑代码
9.8 我的组件(about.vue)
9.8.1 我的组件(about.vue)结构代码
9.8.2 我