vue系统学习路线总结

vue系统学习路线总结

**vue是构建用户界面的渐进式JavaScript框架，其卓越的双向数据绑定及组件化等设计思想得到了技术人的一致好评！
那么，对于新手来说，要如何才能系统完整的学习到vue框架并应用到实际开发工作中呢？**

一、构建vue工程化工具：

利用脚手架工具构建vue项目无疑是好的办法，有webpack、vue-cli；
1、webpack是一个工程化构建工具，可以模块化打包项目，其中主要包括modules、output、entry、plugins等，通过配置可以实现丰富的构建功能；
2、vue-cli是基于webpack的npm包，并带有合理的默认配置选项；

二、vue开发技能：

1、组件通讯：
父子组件通讯：父组件向子组件传递数据，使用prop属性，子组件向父组件传递数据；通过子组件this.$emit(event,data)派发事件及数据至父组件；
非父子组件通讯：Global Event Bus，利用全局注册vue实例，再定义全局事件对数据进行操作（少用）；使用vuex公共状态管理进行组件间通讯；
2、插槽：
为灵活实现组件内容定制化，vue引入插槽功能。分为普通插槽和作用于插槽，再vue2.6.0中，对两种插槽进行统一的语法处理，即使用v-slot代替了slot和slot-scope特性，虽已启用但仍未删除。
3、过度动画：
触发条件： v-if或动态组件或v-show或组件根节点
过度类名：v-enter\v-enter-to\v-enter-active、及leave类似
JavaScript钩子：
`