vue：界面，数据模型 和 控制器
MVVM 通过控制器(ViewModel)，找到界面(View),放入数据模型(Model)
控制器的原理：2大子系统
(1)响应系统:监视模型数据的变化，并通知框架修改页面的机制
(2)虚拟DOM树
虚拟DOM只包含可能会变化的元素和属性。(扫描原始DOM而产生的一棵仅包含可能变化的元素的新的简版DOM树)
虚拟DOM树，仅包含可能变化的元素(遍历快)，仅修改发生变化的元素(效率高)。
绑定语法:在页面中用{{}}指定所需的变量名。(只要需要动态生成值就用绑定语法，刨坑)
双花括号用于内容，冒号用于属性(比如:v-bind;当需要生成动态属性的时候。v-bind：可简写为：)
v-for要写在需要反复创建的元素上。
控制元素的显示隐藏：
v-if，专门根据一个条件表达式决定当前元素是否显示，只有条件表达式为true时，当前元素才显示。
强调！！v-if和v-else if 和 v-else之间不能插入其他元素。
v-if通过添加删除元素的方式控制和显示隐藏
v-show和v-if唯一的不同是隐藏方式，v-show采用的是display：none/block的方式显示和隐藏。
二者从效率上来说v-show更高，因为不需要删减DOM树，但是写条件比较麻烦。
总结：控制一个元素频繁显示隐藏，首选v-show
如果是多个元素选其一，v-if更加合适。
<ANY v-on:事件名="处理函数()"
v-on:click=""可简写为@click=""
new Vue({})中
new Vue({
el:"选择器",
data:{模型变量}, //模型数据
method:{ //专门保存控制器所需所有的自定义方法的属性
处理函数(){ //处理函数:function(){
//this->当前 Vue 对象->vm
this.模型变量 //访问模型变量
}}
},
})
问题：阻止默认行为
解决：1.当事件发生时，自动调用js语句，不传入$event作为参数
<ANY @click="处理函数($event)">
$event就是DOM中的e，是vue封装的事件对象
2.new Vue()中:
methods:{
//定义形参，准备接事件对象
处理函数(e){
e.preventDefault();
}
}
简写:事件修饰符，对DOM中事件API的简写：
2个 阻止默认行为：@click.prevent="处理函数()" //一步等于上方三步
取消冒泡： @click.stop="处理函数()"=>e.stopPropagation()
vue利用虚拟DOM树，提高效率，只修改需要修改的数据，而不是整段代码。
{{}}插值，是用来告诉vue框架，这里需要一个什么名称的数据，占位。
指令，是vue提供，专门来增强html功能的属性。
在事件处理函数中，要想修改当前vue的模型变量要加this.
使用vue实现一个功能，需要两步，第一步，找到页面中可能变化的地方用绑定和指定占位，第二步，页面中需要什么就在new Vue中支持他，页面需要数据就提供变量，要需要处理函数就提供处理函数。
指令：
绑定内容{{}}
绑定属性：
绑定事件@
一个元素显示隐藏v-show
多个元素选其一v-if v-else v-else-if
根据数组反复生成多个页面标签v-for
原始的HTML片段不能用{{}}绑定，{{}}只会保持HTML片段原样，所以需要
v-html="模型变量"代替{{}}，可以额让绑定的HTML片段被浏览器解析。
纯文本内容：可使用{{}}或者v-text
v-cloak，如果希望当new Vue加载慢时，不让用户看到{{}}语法，就用v-cloak临时隐藏页面元素。
可以在style标签中[v-cloak]{display:none}
原理：new Vue加载完成之后，会自动查找v-cloak属性，并移除该属性，使临时隐藏的元素，显示出来。
v-pre：保持内容中双花括{{}}号不被Vue编译，如果内容中刚好有双花括号作为正文则需要v-pre保护。
v-once：仅在首次Vue加载时绑定一次，之后即使变量改变也不更新页面。<any v-once><any>,首次绑定后就将被绑定的元素从虚拟DOM树上移除。
关于双向绑定：
普通的绑定"：属性"，只能将内存中的模型变量单项绑定到界面，而无法将界面的更改，自动更新会模型变量中。 界面<->内存 双向绑定，既能将内存中的数据绑定到界面，也能反向修改，将界面的变化更新到内存模型变量之中。
当希望绑定表单元素的值，一律使用双向绑定。<表单元素 v-model：value="模型变量">，其中：value可以省略。即v-moedl。
绑定键盘事件@keyup.13 (13即是键盘上回车的编号)
绑定class和style
:绑定的情况下，省略了双花括号，只要是绑定语法，里面可以写任意的js表达式。