Vue2

环境搭建

Vue.js是在2014年2月开源的一个前端开发库，作者尤雨溪，任职于纽约Google Creative Lab，2016年9月3日，在南京的JSConf_上，，Vue作者尤雨溪正式宣布加盟阿里巴巴Weex团队。

Vue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue采用自底向上增量开发的设计。Uue的核心库只关注视图层，并且非常容易学习，非常容易与其它库或已有项目整合。另一方面，Vue完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。

Vue.js的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图组件。

vue可以和原生js混合写，react写项目，整个项目都需要使用react

技术栈——指的就是你项目中用到了什么技术？可以把整个React或Vue全家桶里面的技术都说一遍。

渐进式的理解

• 每个框架都不可避免会有白己的一些特点，从而会对使用者有一定的要求，这些要求就是主张，主张有强有弱，它的强势程度会影响在业务开发中的使用方式。
• 使用vue， 你可以在原有大系统的上面，把一两个组件改用它实现，当jQuery用；也可以整个用它全家桶开发，当Angular用；还可以用它的视图，搭配你自己设计的整个下层用。你可以在底层数据逻辑的地方用OO和设计模式的那套理念。也可以函数式，都可以。
• 它只是个轻量视图而己，只做了自己该做的事，没有做不该做的事，仅此而己。
• 你不必一开始就用Vue所有的全家桶，根据场景，官方提供了方便的框架供你使用。

vue的特征之一：MVVM

1. MVWM模式Model-View-ViewModel(数据变量(model)发生改变视图(view)也改变，视图(vlew)改变，数据变量(model)。也发生改变)
2. view和viewModel之间采用双向绑定(data-binding)：View的变动，自动反映在ViewModel，反之亦然
3. View与Model不发生联系，都通过viewModel传递。
4. View非常薄，不部署任何业务逻辑，称为"被动视图”(Passive View)，即设没有任何主动性，而
5. ViewModel非常厚，所有逻辑都部署（指令，事件，dom监听）在那里。
6. Model层主要为应用程序提供数据，主要包含web services，reset services和generic collections(任 何类型的数据集合)

vue组件的操作逻辑比具有MVVM这三部分流程。

vue中没有明显的分界线，哪一块的代码属于View或ViewModel或者Model。

1. view：它就是视图，就是渲染出来的VDOM。View和ViewModel双向绑定。ViewModel改变，View就会更新，View更新，ViewModel就会重新执行进行逻辑处理。
2. viewModel负责了整个逻辑的实现，负责所有的数据处理，它可以向Model发送请求。
3. Model：它主要是用来提供数据的。例如把数据请求回来会存到ViewModel里。ViewModel只能向Model发布一个指令，说我想要一个值。他和ViewModel之间不是双向绑定了，它可以向ViewModel发送数据。

MVC模式

1. View 传送指令到 Controller
2. Controller 完成业务逻辑后，要求 Model 改变状态
3. Model 将新的数据发送到 View，用户得到反馈 所有通信都是单向的。

互动模式

接受用户指令时，MVC 可以分成两种方式。

一种是通过 View 接受指令，传递给 Controller。 另一种是直接传给Controller

vue的特征之二：组件化

• 在大型的应用中，为了分工、复用和可维护性，
• 我们不可避免地需要将应用抽象为多个相对独立的模块。在较为传统的开发模式中，我们只有在考虑复用时才会将某一部分做成组件：但实际上。应用类完全可以看作是全部由组件树构成的：组件树
• 因此，在vue.js的设计中将组件作为一个核心概念。可以说，每一个vuejs应用都是国绕者组件来开发的。

vue的特征之三：指令系统

1. vueJs早期参考了angularJs的语法结构。所以vuejs中的指令系统与angularis中的指令类似，是扩展的html属性，在vuejs中指令带有前缀V-，以表示它们是 Vue.js 提供的特殊属性。它们会在渲染过的DOM 上应用特殊的响应式行为。例如：v-bind 属性，这个指令的简单含义是说：将这个元素节点的title属性和 Vue 实例的message 属性绑定到一起。

vue的特征之四：虚拟DOM

• vue2.0开始支持虚拟dom（提升页面加载速度)。
• react开始的VDOM先河，最先提出的VDOM。

封装的也依然是js，只不过调用的时候以html的属性进行调用的，angular就是这种模式，vue参考了这种