vue.js学习笔记

一、vue.js介绍：
Vue是一套用于构建用户界面的渐进式框架。渐进式框架：vue.js是轻量的，是指一个前端项目可以使用vue.js一两个特性也可以整个项目都用 vue.js。自底向上逐层应用：作为渐进式框架要实现的目标就是方便项目增量开发。

Vue 不支持 IE8 及以下版本，因为 Vue 使用了 IE8 无法模拟的 ECMAScript 5 特性。

vue.js功能有：1）声明式渲染：Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统。 比如：使用vue.js的插值表达式放在Dom的任意地方， 差值表达式的值将被渲染在Dom中。 2）条件与循环：dom中可以使用vue.js提供的v-if、v-for等标签，方便对数据进行判断、循环。 3）双向数据绑定：Vue 提供v-model 指令，它可以轻松实现Dom元素和数据对象之间双向绑定，即修改Dom元素中的值自动修改绑 定的数据对象，修改数据对象的值自动修改Dom元素中的值。 4）处理用户输入：为了让用户和你的应用进行交互，我们可以用 v-on 指令添加一个事件监听器，通过它调用在 Vue 实例中定义的 方法。5）组件化应用构建：vue.js可以定义一个一个的组件，在vue页面中引用组件，这个功能非常适合构建大型应用。

二、vue.js基础：
vue.js是一个MVVM的框架。
MVVM拆分解释为：Model:负责数据存储 。View:负责页面展示。View Model:负责业务逻辑处理（比如Ajax请求等），对数据进行加工后交给视图展示。MVVM要解决的问题是将业务逻辑代码与视图代码进行完全分离，使各自的职责更加清晰，后期代码维护更加简单 。
VM(ViewModel)可以把view视图和Model模型解耦合，VM的要做的工作就是vue.js所承担的。
如下图：

1、代码编写过程：
1）、定义html，引入vue.js
2）、定义vue的接管区域
3）、定义vue实例，接管2中的区域
4）、定义model(数据对象)
5）、验证VM让model在view中显示

2、常用控件：
v-model：表单控件，绑定数据。仅可以用于：input select textarea components（Vue中的组件）
v-text：将值渲染到指定的元素中。
v-on：绑定一个按钮的单机事件。
v-bind：可以将数据对象绑定在dom的任意属性中，也可以给dom对象绑定一个或多个特性，例如动态绑定style和class
v‐for：遍历使用
v‐if、 v‐else：判断使用