课程简介
Vue 是前端开发的主流框架,是一个典型的MVVM结构,随着版的不断迭代,功能越发强大,渐渐成为前端开发的首选和必备框架,许多大型的企业都纷纷将该框架应用到自己的项目中,虽然该框架入门易,但精通很难,必须要有实战开发的经历。
本课程从最基础的项目构建讲起,详细介绍 Vue 的方方面面,包含组件的定义、传值和路由、指令的定义和应用,并结合最新的案例,讲述框架开发项目的流程和注意事项,最后,完整地介绍了项目上线后的代码测试和部署过程。
目标收益
学习Vue基础开发的全部功能。
学会如何在项目中应用Vue框架开发。
掌握在项目中定义和使用组件的过程。
了解路由和指令应用的方法和技巧。
理解并掌握Vue 项目上线和部署的流程。
培训对象
正在从事传统PC端Web页面的技术开发人员。
希望从事移动端WebApp应用开发的技术人员。
对前端技术感兴趣,希望从事这方面工作的人员。
掌握一些传统的前端开发技术,想进一步学习移动端应用开发的人员。
课程大纲
Vue框架创建项目 |
1.1环境构建 1.2新建项目 1.3项目结构分析 1.4框架创建项目注意事项 |
Vue基础与数据绑定 |
2.1构造器 2.2文本操作 2.3表达式 2.4数据绑定 |
常用指令与过滤器 |
3.1基础指令 3.2高级指令 3.3常用过滤器 3.4数据排序 |
事件与特效 |
4.1样式操作 4.2表单控件 4.3事件处理 4.4过渡效果 |
自定义操作 |
5.1自定义指令 5.2自定义过滤器 5.3自定义组件 |
组件基础开发 |
6.1组件的定义与传值 6.2组件的动态传值 6.3组件的属性值的验证 |
组件高级应用 |
7.1组件的自定义事件并向父传值 7.2多个子类组件的使用 7.3使用子类组件优化页面代码 |
指令的应用 |
8.1什么是指令 8.2定义指令的方法 8.3指令的使用 |
Vue框架的路由 |
9.1路由的功能和定义方法 9.2路由切换时的事件触发 9.3路由配置时注意事项 |
Vue框架项目实战 |
10.1案例一:无刷新的导航条 10.2案例二:单页面人员信息管理 10.3案例三:多数据联动的购物车 |
单元测试mocha的应用 |
11.1使用语法 11.2浏览器测试 11.3异步测试 |
Vue框架内测试 |
12.1内置测试框架 12.2单元测试的配置 12.3测试时注意事项 |
打包工具webpack的应用 |
13.1特点与优势 13.2安装与配置 13.3使用方法 |
Vue框架上线发布 |
14.1项目打包与发布 14.2打包时的资源配置 14.3发布时的代码压缩 |
Vue框架创建项目 1.1环境构建 1.2新建项目 1.3项目结构分析 1.4框架创建项目注意事项 |
Vue基础与数据绑定 2.1构造器 2.2文本操作 2.3表达式 2.4数据绑定 |
常用指令与过滤器 3.1基础指令 3.2高级指令 3.3常用过滤器 3.4数据排序 |
事件与特效 4.1样式操作 4.2表单控件 4.3事件处理 4.4过渡效果 |
自定义操作 5.1自定义指令 5.2自定义过滤器 5.3自定义组件 |
组件基础开发 6.1组件的定义与传值 6.2组件的动态传值 6.3组件的属性值的验证 |
组件高级应用 7.1组件的自定义事件并向父传值 7.2多个子类组件的使用 7.3使用子类组件优化页面代码 |
指令的应用 8.1什么是指令 8.2定义指令的方法 8.3指令的使用 |
Vue框架的路由 9.1路由的功能和定义方法 9.2路由切换时的事件触发 9.3路由配置时注意事项 |
Vue框架项目实战 10.1案例一:无刷新的导航条 10.2案例二:单页面人员信息管理 10.3案例三:多数据联动的购物车 |
单元测试mocha的应用 11.1使用语法 11.2浏览器测试 11.3异步测试 |
Vue框架内测试 12.1内置测试框架 12.2单元测试的配置 12.3测试时注意事项 |
打包工具webpack的应用 13.1特点与优势 13.2安装与配置 13.3使用方法 |
Vue框架上线发布 14.1项目打包与发布 14.2打包时的资源配置 14.3发布时的代码压缩 |