条件渲染
（一）.v-for 下标索引的两种使用方法
1.在使用 v-for 进行数组数据的展示时，我们可以用一个特殊的变量$index，这个$index 是默认的，它能够展示当前数组中的 下标索引 ，在代码中的写法是： 双大括号包$index ，这样就能够展示当前的索引值。如果需要得到索引值所对应的 键值 ，即只需要使用另外一个特殊的变量 $key 即可得到，同样也可以给对象键值定义一个变量。
2.在 v-for 中给索引指定一个别名为 index，例如：
1 | v-for="(index,item) in content" |
这样 index 就是索引的别名了，可以直接操作大括号包 index 查看当前数组的索引。
（二）.事件修饰符
在事件处理器中经常调用 event.preventDefault()或 event.stopPropagation()，我们可以在方法内轻松做到，但是让方法是纯粹的数据逻辑而不处理 DOM 事件细节更好；这种情况下，v-on 提供了两个事件修饰符，即 .prevent 和 .stop 。
例如：
1 | <a v-on:click.stop="doThis">这是一个事件修饰符事件</a> |
不仅有事件修饰符，还有按键修饰符，如 enter 键的：
例：
1 | <input v-on:keyup.enter="submit"> |
在 HTML 使用监听事件 v-on 的好处 ：
1.在 HTML 代码中能够轻松的定位 JavaScript 代码中对应的方法；
2.因为不需要在 JavaScript 里手动绑定事件，ViewModel 代码可以是非常纯粹的逻辑，和 DOM 完全解耦，更易于测试；
3.当一个 ViewModel 被销毁时，所有的事件处理器都会自动被删除，不需要自己去清理；
（三）.参数特性
当我们在使用 v-model 的时候能够很好的将 input 框中的数据实时的反应到页面上，有时候我们需要对 input 框中的一些数据添加一些特殊的特性，即有下面的学习：
1.lazy 属性，将 input 事件中更新的改到 change 事件中同步；
写法：
1 | <input v-model="msg" lazy> |
2.number 属性，将 input 框中的值直接转换成数值
写法：
1 | <input v-model="age" number> |
3.debounce 属性，设置一个小延时，在 input 中做更改了之后在延时完才实时展示到页面上
写法：
1 | <input v-model="msg" debounce="500"> |
注意 ：debounce 参数不会延迟 input 事件，它延迟写入底层数据，因此在使用 debounce 时应当用 vm.\$watch()响应数据变化，若要延迟 DOM 事件，应当使用 debounce 过滤器。