| 适用人群： 本课程对于有一定CSS,JS基础的小伙伴们！ 教学目标： 1.使用Vue快速提高开发效率8 2.掌握MVVM的开发思想 3.开发可复用的自定义 4.独立使用Vue开发完整项目 课程大纲： 一.入门vue$ 1.掌握数组新增的es5及es6常用方法forEach,map,filter,reduce 2.掌握es6常见语法 解构赋值，箭头函数，拓展运算符的使用# 3.vue基础使用 取值表达式的引用 4.v-model双向数据绑定 介绍Object.defineProperty用法，实现一个双向绑定 5.简介常用指令 v-bind,v-text,v-html,v-once,v-cloak的使用% v- L4 v/ I! w! i2 n! w B 6.深入响应原理 Object.assign 和数组的变异1 S+ v1 [3 S% W0 m$ c, X 7.v-for的使用 嵌套循环以及key的使用) v G# ]% r* j7 {% `% U 8.事件的使用 在vue中绑定事件，详解事件源和事件修饰符的用法 9.双向绑定之表单元素 checkbox,input,radio的使用 二.vue中的数据获取以及进阶用法 ; @* F# f% |* ]5 Q# ~3 ^4 P. ^ 1.axios的基础使用 2.介绍promise的用法 自己封装promise版的ajax' w1 p( G1 V, m 3.实现购物车功能3 m1 f: ~: }& p, ]: ^( o 4.计算属性&&watch应用 对比method，watch和computed的异同7 l1 v5 M0 k- o* B. ^8 Y 5.vue中的动画 transition以及transition-group的使用 6.动态绑定数据 v-bind的使用,绑定样式:class :style 7.自定义指令以及过滤器的使用 directive filter的应用 8.实现todoList 三.探索vue的生命周期 1.vue中的钩子函数6 |' x( C$ u ~& f$ D' } 2.keep-alive缓存的使用 缓存的钩子activated deactivated# q( X5 D6 Y* Q; \. P- I 四.vue中的组件 4 Y N7 f3 p- |2 ]6 j) P 1.全局组件和局部组件的使用 组件中的data函数" r6 X Z* Y, N9 ? 2.组件交互之父传子 props的应用，与属性检验type,require,validator等 3.组件交互之子传父 通过eventBus，自己实现发布订阅模式 4.组件案例之模态框5 a( V% k. o! u/ T1 t 5.ref的应用 获取dom元素，已经组件实例9 a5 A6 H. J( Z* v( @ 6.nextTick用法解析 7.slot用法解析 8.实现面板组件 五.webpack的基础应用% V% Y; n8 j& L7 K( @8 T o 1.babel解析es6,es7) @1 L0 M4 ~4 Z 2.处理css,less样式 3.处理图片以及图标字体/ j2 ]5 g b! r' r' M( X 4.解析vue-loader,.vue文件 5.html-webpack-plugin的使用- H1 [4 U: m: A# ^ 6.封装vue插件之notify组件 六.进阶vue路由 1.基础路由搭建 2.编程式导航# a% c. p" X3 V 3.路由的嵌套5 d6 X/ R) K4 ]. i8 P6 ]5 Z4 G 4.在路由中发送ajax获取数据 5.路由导航钩子的使用; X6 w* U/ v5 [- s5 p( v1 Z; T 6.实现路由动画 r4 g! E2 c, t# J 七.vue-cli应用4 g1 Z7 h1 I+ ?# w9 v* T( ` 1.vue-cli代码解析0 ?2 ^% Y Z2 \7 B) ^ 2.应用vue-cli搭建书城项目 下载地址： |
| 欢迎光临 吾爱编程 (http://www.52pg.net/) | Powered by Discuz! X3.2 |