2.1 语法

2.1.1 插值

文本插值是最基本的形式，使用双大括号{{}}
有时只需要渲染一次数据，可以通过{{*}}实现
如果值是HTML片段，则可以使用三个大括号来绑定{{{}}}
双大括号标签也可放在HTML标签内

2.1.2 表达式

Mustache标签也接受表达式形式的值
不支持语句
类似Linux的管道，允许在表达式后添加过滤符

{{example | filter a b}} //即传入a,b两个参数

2.1.3 指令

v-if 如果为false,对应的元素将从dom树移除，否则，对应元素的一个clone会被重新插入到DOM中
v-show 如果为false,元素将被隐藏，查看元素时，会多了一个内联样式style=”display:none”
v-show不支持[HTML_REMOVED]语法
v-else 必须跟着v-if或v-show，充当else功能
v-module 常用来在input,select,text,checkbox,radio等表单元素创建双向数据绑定
也可添加多个参数
1、number 将用户的输入自动转为Number类型
2、lazy 将数据改到change事件中发生

<div id="example">
  <input type="text" v-model="msg" lazy><br>
  {{msg}}

</div>
var vm = new Vue({
  el: '#example',
  data:{
    msg:'内容在change后改变'
  }
})

3、debounce 设置一个最小的延时，在每次敲击后延时同步输入框的值与数据,如果每次更新要进行高耗操作(eg 在input后随时发送ajax请求)，那么它较为有用

v-for 基于源数据重复渲染元素
支持in/of 分隔符
当数组数据出现变动时，可以触发视图更新
v-for也支持整数，同时还可以和vue.js提供的内置过滤器或排序数据一起使用
filterBy 和 orderBy
v-text 可以更新元素的textContent,在内部，{{Mustache}}插值也被编译为textNode的一个v-text指令，代码示例如下

<span v-text="msg"></span><br>
<!-- same as -->
<span>{{msg}}</span>

v-html 可以更新元素的innerHTML,很容易导致XSS攻击
v-bind 将一个组件prop动态绑定到表达式 v-bind可以简写为:
没有参数时，可以绑定到一个对象
v-on指令用于事件监听器，事件类型由参数决定
使用在普通元素上时，只能监听原生DOM事件，使用在自定义组件上时，可以监听子组件触发的自定义事件

<!-- 停止冒泡-->
<button @click.stop="function name"></button>
<!--阻止默认行为 -->
<button @click.prevent="function name></button>

v-pre：跳过编译过程
v-once:动态渲染后，成为静态内容
v-ref:在父组件上注册一个子组件的索引，便于直接访问
v-el:

3.2自定义指令

基础：
1、钩子函数