Vue 内置指令
1.指令 (Directives)： 是带有 v- 前缀的特殊属性， 职责是，
当表达式的值改变时， 将其产生的连带影响，响应式地作用于 DOM。
2.HTML DOM 节点
在 HTML DOM (Document Object Model) 中 , 每一个元素都是 节点:
- 文档是一个文档。
- 所有的HTML元素都是元素节点。
- 所有 HTML 属性都是属性节点。
- 文本插入到 HTML 元素是文本节点。are text nodes。
- 注释是注释节点。
Document 对象
当浏览器载入 HTML 文档, 它就会成为 document 对象。
document 对象是HTML文档的根节点与所有其他节点（元素节点，文本节点，属性节点, 注释节点）。
Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。
提示：Document 对象是 Window 对象的一部分，可通过 window.document 属性对其进行访问。
3.内置指令
1、v-bind：响应并更新DOM特性；例如：v-bind:href v-bind:class v-bind:title 等等
主要用法是绑定属性，动态更新HTML元素上的属性；
2、v-on：用于监听DOM事件； 例如：v-on:click v-on:keyup
2.1 @click 的表达式可以直接使用JavaScript 语句，也可以是一个在Vue 实例中methods 选项内的函数名，可以在方法中传递参数
<a v-on:click="doSomething">...</a> <a @click="doSomething()">...</a>
2.2方法与事件：
Vue 提供了一个特殊变量$event ，用于访问原生DOM 事件，可以阻止事件冒泡或者阻止链接打开
2.3修饰符：
在＠绑定的事件后加小圆点“．”，再跟一个后缀来使用修饰符。
常用的一些修饰符有：
• .stop
• .prevent
• .capture
• .self
• .once
阻止单击事件冒泡 <a @click.stop=”handle "></a>修饰符可以串联 <a @click.stop.prevent=” handle ” ></a>一添加事件侦听器时使用事件捕获模式 <div @click . capture=”handle ”> ... </div>只当事件在该元素本身（而不是子元素） 触发时触发回调 <div @click.self=” handle ”> ... </div>一只触发一次，组件同样适用<div @click.once=” handle ”> ... </div> 只有在keyCode 是13 时调用vm.submit() <input @keyup.13 ＝“ submit ”〉4、v-show：条件渲染指令，为DOM设置css的style属性
5、v-if：条件渲染指令，动态在DOM内添加或删除DOM元素
6、v-else：条件渲染指令，必须跟v-if成对使用
7、v-else-if：判断多层条件，必须跟v-if成对使用；
8、v-text：更新元素的textContent；例如：<span v-text="msg"></span> 等同于 < span>{{msg}} </ span>；
9、v-html：更新元素的innerHTML；会把标签名也带上。
10、v-for：循环指令
10.1 v- for 的表达式遍历数组时支持一个可选参数作为当前项的索引，
例如：<li v-for="(book , index) in books ">{{ index}} - {{book.name })</li>
10.2 v- for 的表达式遍历对象属性时，有两个可选参数，分别是键名(key)和索引(index)：
<li v-for="(value , key , index) in user ">
{ { index } } - { { key } } : { { value } } </li> <span v-for="n in 10">{{n}}</span>
10.4 数组更新
当我们修改数组时， Vue 会检测到数据变化，所以用v-for 渲染的视图也会立即更新。
• push()
• pop()
• shift()
• unshit（）
• splice()
• sort（）
• reverse()
11、v-cloak：不需要表达式，这个指令保持在元素上直到关联实例结束编译； v-cloak 是一个解决初始化慢导致页面闪动的最佳实践 ；
12、v-once：也是一个不需要表达式的指令，作用是定义它的元素或组件只渲染一次，包括元素或组件的所有子节点。
首次渲染后，不再随数据的变化重新渲染，将被视为静态内容； v-once 在业务中也很少使用，当你需要进一步优化性能时，可能会用到。
13、v-pre：不需要表达式，跳过这个元素以及子元素的编译过程，以此来加快整个项目的编译速度；
14.label for 绑定对应的form标签，
<input type="radio" v-model="pick" id="r1" v-bind:value="a">
<label for="r1">r1</label>
如果绑定了点击这个标签里面的内容光标会获取焦点到ID为r1 的radio单选框，即点击r1即可选中单选框
15.el：element，需要获取的对应元素，html中的容器，（id名）
data：数据存储，里面的值自己设置
PS:用逗号分隔，不要用分号！！！！
如果，在div外使用{{ name }}，是不会出现字符串的，因为离开了div块，el的容器
每次新建一个js对象都是 new Vue（），不同的只是el对应绑定的模块
