数据绑定最常见的形式就是使用 “Mustache” 语法（双大括号）的文本插值：
例如{{name}}，如果只想插入一次就用<span v-once>{{name}}</span>;
每个通过vue绑定的属性都是返回json，所以这里面可以写表达式，但是不能写语句。
一.VUE指令
1.v-text 更新元素的textcontent
<span v-text="msg"></span>
<!-- 和下面的一样 -->
<span>{{msg}}</span>
2.v-html 更新元素的innerhtml。（内容按普通html插入，不会作为Vue模板进行编译，只在可信内容上使用，永不用在用户提交的内容上）
<div v-html="html"></div>
3.v-show 值为布尔值true或false，来切换元素的display值
4.v-if v-if与v-show的区别在于v-if的元素及数据绑定/组件被销毁并重建，而v-show只是改变display值，v-else以及v-else-if同上
5.v-for 基于源数据多次渲染元素或模板块，必须使用特定语法alias in expression，为当前遍历的元素提供别名。
<div id="app">
<div v-for="(item,index) in list">{{item.name}}--{{index}}</div>
<--这里面item代表源数据里面的每个数据，这里支持第二个参数为当前项的索引,这里也可以用of来替代in in是代表遍历属性，of表示遍历值-->
</div>
<script type="text/javascript" src="js/vue.js"></script>
<script type="text/javascript">
var app = new Vue({
el:"#app",
data:{
list:[
{name:"bgg"},
{name:"xiongmao"}
]
}
})
</script>
6.v-on 绑定监听事件，事件类型由参数指定，用在普通元素上面只能监听原生DOM事件，用在自定义组件上面可以监听子组件触发的自定义事件，在监听原生Dom事件时，方法以事件为唯一的参数，如果使用内联语句，只可以访问一个$event属性v-on:click="handle('ok', $event)" ------------重点--------------
-------------------修饰符--------------------------------
.stop 调用event.stoppropagation()事件
.prevent 阻止默认事件，调用event.preventdefault();
.capture 添加侦听事件的时候使用capture模式
.self 只当事件是从侦听器绑定的元素本身触发时才回调
.{keyCode |keyalias} 只当事件是从侦听器绑定的元素本身触发时才回调
.native 监听组件根元素的原生事件
7. v-bind 我们主要是使用v-bind来绑定标签的属性。
<div :style="{color:'red',fontSize:'100px'}">123</div>
注意style里面是一个json对象，所以一定要加花括号
<div id="app-1" v-bind:style="[bgg,name]">
{{some}}
<div :style="{color:isred}">123</div>
<p :style="{color:'red'}">这是一个p标签</p>
</div>
<script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var app1=new Vue({
el:"#app-1",//注意Vue注册要写在前面，实例化要写在后面，要不会报错
data:{
some:"这是一个div",
bgg:{
fontSize:"100px",
color:"red"
},
name:{
fontSize:"20px"
},
isred:'blue' //这里是字符串拼接的方式，所以一定要注意单引号跟双引号的区别
}
})
</script>
8.v-model 属于表单的双向绑定，主要用在input，select，textarea，components上面
1. .lazy取代input的监听change事件
2. .number将字符串转化为数字
3. .trim输入首尾空格过滤
9.v-pre 跳过这个元素和它的子元素的编译过程。可以用来现实原始的Mustache标签，跳过大量的没有指令的节点会加快编译
<span v-pre>{{ this will not be compiled }}</span>
10.v-cloak 这个指令保持在元素上直到关联实例结束编译。如果和css规则一起使用，这个指令可以隐藏未编译的Mustache标签直到实例准备完毕。可以用来调试
<div v-cloak>
{{ message }}
</div>
[v-cloak] {
display: none;
}
11.v-once 只渲染元素和组件一次。随后的重新渲染元素/组件及其所有的子节点将被视为静态内容并跳过。可以优化更新性能。