vue学习总结

引言

随着学习vue2.0的脚步加快，突然之间感觉自己的知识点有一些遗漏，为了巩固所学知识，同时也为了查漏补缺，
以根据自己学习和做项目的情况整理了我个人的vue技术栈，知识点梳理如下：

开发环境搭建

老话说的好‘工欲善其事，必先利其器’，在我们程序员的世界里要想开发出一款优秀的项目，一个好的开发环境是必需的。
vue的开发环境是node.js和git的结合，尤其是node.js现在更是成为了我们前端开发者在面试时的加分项，甚者是必须项，今天的主角是vue，所以node.js就不多讲了。不过可以为喜爱他的童鞋提供几篇高质量的文章

环境搭建：

Vue2.0史上最全入坑教程（上）—— 搭建Vue脚手架（vue-cli）

Vue2.0史上最全入坑教程（中）—— 脚手架代码详解

以下两篇是一个实战项目,需要的童鞋可以看一下；

Vue2.0史上最全入坑教程（下）—— 实战案例

Vue2.0史上最全入坑教程（完）—— 实战案例

node.js:

node.js - 收藏集 - 掘金(其中有几十篇高质量文章)

注：在学习开始之前，先看一篇文章,作为vue学习的引子我们来看看尤大神谈vue.js

知识点整理

1. vue-cli
2. vue指令
3. vue组件系统
4. vue-router
5. vuex
6. vue插件
7. axios
8. webpack
9. vue前端框架（muse-ui, element-ui）
10. sass，less, stylus

vue的其他特性

1.异步批量的dom更新：避免一个数据产生多余的dom操作
2.动画系统：使定义animation，transition变得更加单的同时还可以使用钩子函数对动画进行控制
3.可扩展性：自定义指令，过滤器，和组件，还有mixins的可以多个组件中复用共同的特性

知识点1 （vue-cli）

vue-cli是我们创建vue项目的vue依赖环境，而vue-cli的依赖于的node.js，因为vue-cli是node.js的一个插件，
而开发一个项目我们都会牵涉到项目版本的管理，所以需要一个版本控制系统，而git刚好是这样一个好用的工具，
在项目的开发和发布过程中需要一个管理工具这个管理工具是webpack，现在很流行的一款工具。

知识点2 （vue指令）

在非MVVM开发过程中我们使用的jquery，zepto.js， 我们使用它最多的是对dom的操作，一部分是ajax请求；
而在MVVM项目中如angular和vue，我们对dom的操作使用的是指令

补充：在非MVVM项目中我们采用的模块化开发使用的是sea.js，require.js，对业务模块进行管理；
而在MVVM项目中我们我们的模块化在vue中的体现就是组件系统

知识点3 （vue组件系统）

组件vue中的核心概念，几乎所有的应用都是围绕着组件来展开的。在vue的设计中将组件作为基础元素，由它组成了整个应用的布局。
因此整个项目的架构看起来就像是一个组件树

知识点4 (vue-router)

如果按照尤大神说组件系统是vue的核心的话，那么那么如果将组件在形式上连接起来就需要vue-router，为什么说是形式上呢？
其一因为一个项目不可能在一个页面上展现所有的业务，这样的应用使用起来不方便，也不利于维护，所以需要将项目分为若干个页面；
另一点是，vue组件间的通信有自己的机制，就是props，event up， vue空实例中央总线。

vue官方文档

知识点5 （vuex）

vuex其实可以理解为一个解决方案，在一般的中小项目因为应用的业务比较单一，业务逻辑也不复杂，不同逻辑间的数据传递使用
props，event up，外加vue空实例中央总线就可以满足，但是大型项目有业务繁多，业务逻辑也比较复杂，所以整个项目的组件会达到数千个，
甚至上万个。这样只凭上面三板斧，一般的程序员无法驾驭这种级别的项目，而vuex正是解决这种情况的官方方案。

知识点6 （vue插件）

有的人认为vue有了组件系统为什么还需要插件这个东西，其实也没什么，就比如我们有了双手后为什么还要使用工具一样，解放生产力吗?

知识点7 （axios）

axio原文

axios 官方文档翻译已经很详尽了，如果想快速上手下面有一篇文章

http://www.jianshu.com/p/8e5fb763c3d7

知识点8 （webpack）

文章：

系列一： youngwind的github blog项目

系列二： arry_huang的segmentdefault中的系列文章

知识点9 （vue ui组件）

muse-ui（查看开发文档）

element-ui（查看开发文档）

知识点10 （sass， less， stylus）

sass: 阮一峰老师的sass用法指南

stylus: 张鑫旭的使用指南

其他

知道了以上的内容我们可以开发出更优秀的项目，但是这有一个前提，我们还需要了解其他的vue知识，这包括

全局配置（待学习）

silent
optionMergeStrategies
devtools
errorHandler
warnHandler
ignoredElements
keyCodes
performance
productionTip

全局API

Vue.extend
Vue.nextTick
Vue.set
Vue.delete
Vue.directive
Vue.mixin
Vue.compile
Vue.filter
Vue.component
Vue.use
Vue.version

vue/选项

选项包括：
dom,
数据（data，props，propsData，computed，method，watch），
生命周期钩子，
资源（组件，指令，过滤器），
组合（parent，mixins，extends，provide/inject）,
其它

vue的实例

.

官网提供的其他常用组件

transition
slot
keep-alive

现阶段所接触和实现过的大致就是以上的内容，希望可以给初学的同学启发