Vue.js跨平台开发基础教程

　　本书以培养前端工程师为目标，基于工作任务模式进行编写，全面讲解了Vue.js开发的知识。 \n本书共10个模块。模块1～3介绍Vue框架的基础知识，包括开发环境、Vue构造器基本选项、Vue指令，学习Vue的基础知识。模块4介绍Vue过渡，包括基于CSS过渡与动画的过渡，以及Vue与一些主流动画库的结合应用，初步了解Vue的通用性与先进性。模块5介绍Vue复用，为Vue组件与复杂应用开发奠定基础。模块6介绍Vue自定义组件，组件是Vue的核心，自此开始Vue重点与难点知识的学习。模块7介绍Vue路由，路由是单页面应用的基石，也是Vue的核心插件，插件在Vue中占有非常重要的地位。模块8介绍Vue CLI，包括搭建CLI脚手架项目，并对模块7中的路由工作任务进行了重构，巩固路由的学习，并引入了企业开发技术。模块9介绍Vuex与Axios，介绍Vue开发的实用技术。模块10介绍Vue与element-ui的结合应用，拓展Vue的应用与介绍，完整实践企业Vue项目开发，全面训练岗位技能，培养职业素养。 \n本书可作为应用型本科与高职高专院校Vue前端开发技术或跨平台开发课程的教材；也可作为前端开发技术人员的技术参考资料、培训用书或自学参考书。

　　刘培林，无锡职业技术学院软件技术专业带头人，骨干教师。有12年的企业软件项目开发经验，主持和参与过多项重大软件技术项目研发，包括“蛟龙号”载人潜水器操纵模拟系统教控软件子系统的研发，有13年的软件技术专业教学经验，多次主持软件技术专业人才培养方案制定。在国内外公开出版的学术刊物、国际学术会议上发表论文20多篇，主编《C#可视化程序设计案例教程》教材2013年被评为江苏省十二五重点教材。

前言 \n
模块1 Vue概述1 \n
任务1.1 了解Vue基础知识1 \n
1.1.1 前端开发概述1 \n
1.1.2 Vue创始人介绍2 \n
1.1.3 什么是Vue2 \n
1.1.4 Vue的优势3 \n
任务1.2 熟悉Vue项目开发环境5 \n
1.2.1 编辑器概述5 \n
1.2.2 安装HBuilderX编辑器6 \n
1.2.3 创建与调试Vue项目6 \n
模块小结8 \n
习题19 \n
实训19 \n
模块2 Vue实例10 \n
任务2.1 显示诗词10 \n
2.1.1 创建Vue实例10 \n
2.1.2 根元素选项（el）11 \n
2.1.3 数据选项（data）12 \n
任务2.2 设计数据编码器16 \n
2.2.1 过滤选项（filters）17 \n
2.2.2 方法选项（methods）18 \n
任务2.3 编写模拟购物车21 \n
2.3.1 计算选项（computed）21 \n
2.3.2 状态监听选项（watch）23 \n
2.3.3 computed与watch选项的应用场景24 \n
任务2.4 学习Vue生命周期27 \n
2.4.1 生命周期概述27 \n
2.4.2 生命周期事件27 \n
2.4.3 Vue实例方法与属性29 \n
模块小结33 \n
习题233 \n
实训234 \n
模块3 Vue指令35 \n
任务3.1 开发用户注册程序35 \n
3.1.1 v-text指令35 \n
3.1.2 v-html指令36 \n
3.1.3 v-model指令37 \n
3.1.4 v-if、v-else和v-show指令41 \n
任务3.2 开发用户登录程序44 \n
3.2.1 v-bind指令44 \n
3.2.2 过滤v-bind指令绑定的属性46 \n
3.2.3 绑定class与style属性46 \n
任务3.3 设计电子商务购物车51 \n
3.3.1 v-for指令51 \n
3.3.2 v-on指令55 \n
3.3.3 v-on指令修饰符56 \n
模块小结60 \n
习题360 \n
实训361 \n
模块4 Vue过渡62 \n
任务4.1 学习过渡组件62 \n
4.1.1 组件定义62 \n
4.1.2 类名前缀属性66 \n
4.1.3 自定义类名属性68 \n
4.1.4 钩子函数70 \n
4.1.5 初始动画属性72 \n
任务4.2 掌握多元素过渡方法72 \n
4.2.1 多元素过渡72 \n
4.2.2 过渡模式75 \n
任务4.3 掌握列表与状态过渡方法76 \n
4.3.1 组件定义76 \n
4.3.2 排序过渡属性（move）77 \n
4.3.3 交错过渡79 \n
4.3.4 状态过渡80 \n
模块小结82 \n
习题482 \n
实训483 \n
模块5 Vue复用84 \n
任务5.1 设计管理用户权限指令84 \n
5.1.1 自定义指令84 \n
5.1.2 响应式属性（set）86 \n
任务5.2 设计维护用户信息程序88 \n
5.2.1 继承（extend）89 \n
5.2.2 混入（mixin）93 \n
任务5.3 掌握插件用法98 \n
5.3.1 插件概述98 \n
5.3.2 安装插件98 \n
5.3.3 开发插件98 \n
模块小结100 \n
习题5100 \n
实训5101 \n
模块6 Vue自定义组件102 \n
任务6.1 设计计分器组件102 \n
6.1.1 组件定义与注册103 \n
6.1.2 组件模板106 \n
6.1.3 选项作用域106 \n
6.1.4 组件的生命周期107 \n
任务6.2 编写搜索框组件108 \n
6.2.1 props选项109 \n
6.2.2 插槽111 \n
6.2.3 箭头函数113 \n
任务6.3 开发管理用户账户组件115 \n
6.3.1 $emit()方法116 \n
6.3.2 动态组件118 \n
6.3.3 动态组件过渡119 \n
模块小结122 \n
习题6123 \n
实训6123 \n
模块7 Vue路由124 \n
任务7.1 设计页面路由124 \n
7.1.1 单页面应用124 \n
7.1.2 路由视图125 \n
7.1.3 路由构造器125 \n
7.1.4 路由导航128 \n
7.1.5 路由过渡131 \n
任务7.2 给路由传递参数134 \n
7.2.1 路由实例134 \n
7.2.2 路由管理器对象134 \n
7.2.3 query方式的参数传递136 \n
7.2.4 params方式的参数传递138 \n
7.2.5 路由的模式139 \n
任务7.3 设计嵌套路由140 \n
7.3.1 嵌套路由父级设计140 \n
7.3.2 嵌套路由子级设计143 \n
模块小结144 \n
习题7145 \n
实训7145 \n
模块8 Vue CLI146 \n
任务8.1 了解CLI基础知识146 \n
8.1.1 Vue CLI的特点146 \n
8.1.2 CLI安装必备146 \n
8.1.3 Git-Bash命令行工具147 \n
任务8.2 创建CLI项目148 \n
8.2.1 命令行创建与运行CLI项目148 \n
8.2.2 在HBuilderX环境下创建与运行CLI项目150 \n
任务8.3 实战CLI项目152 \n
8.3.1 单文件组件153 \n
8.3.2 导入与导出语句154 \n
8.3.3 CLI项目结构分析155 \n
任务8.4 开发用户管理CLI项目158 \n
8.4.1 CLI插件158 \n
8.4.2 安装插件158 \n
模块小结161 \n
习题8161 \n
实训8162 \n
模块9 Vuex与Axios163 \n
任务9.1 了解Vuex基础知识163 \n
9.1.1 Vuex概述163 \n
9.1.2 Store构造器164 \n
任务9.2 学习Store构造器的选项164 \n
9.2.1 状态管理164 \n
9.2.2 Getter166 \n
9.2.3 Mutation167 \n
9.2.4 Action168 \n
任务9.3 使用模块定义Vuex170 \n
9.3.1 modules选项170 \n
9.3.2 动态注册模块171 \n
任务9.4 掌握Axios的用法172 \n
9.4.1 Axios概述172 \n
9.4.2 参数传递173 \n
任务9.5 开发天气预报CLI项目174 \n
9.5.1 项目创建175 \n
9.5.2 项目实施176 \n
9.5.3 项目测试与运行179 \n
模块小结179 \n
习题9179 \n
实训9180 \n
模块10 电子商务系统181 \n
任务10.1 掌握element-ui的用法181 \n
10.1.1 element-ui概述181 \n
10.1.2 使用element-ui182 \n
任务10.2 分析电子商务系统182 \n
10.2.1 项目概述182 \n
10.2.2 项目分析183 \n
10.2.3 项目创建184 \n
10.2.4 创建准备185 \n
任务10.3 设计系统首页185 \n
10.3.1 设计导航信息栏185 \n
10.3.2 设计标题搜索栏187 \n
10.3.3 设计商品展示栏188 \n
任务10.4 设计“我的购物车”页面192 \n
10.4.1 设计商品信息栏192 \n
10.4.2 设计购物结算栏194 \n
任务10.5 设计商家后台管理模块196 \n
10.5.1 菜单设计196 \n
10.5.2 首页设计199 \n
任务10.6 设计商品管理模块199 \n
1