一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第2天，点击查看活动详情。
v-on
v-on指令用于监听DOM事件，可以简写为@，在methods去定义对应的方法，定义之后可以直接通过组件实例去访问，还可以从组件的模板中去访问这些方法。我们需要注意的是不要使用箭头函数，因为箭头函数绑定的是父级作用域，导致this指向的不是组件实例。如果使用箭头函数的话，this获取的数据时undefined。我们一般不在指令表达式中书写js语句，这是因为写太多看起来不方便而且逻辑处理也比较麻烦。在页面渲染时，不会将指令所在元素上的js事件属性进行渲染。当我们在指令上绑定事件处理器的时候，可以直接使用$event传入dom对象并且在事件处理方法中访问原生事件对象event.preventDefault。
v-for
v-for指令用来使用循环方式渲染一个列表。循环的对象可以是数组或者js对象。v-for指令的表达式可以使用of替代in作为分隔符。在v-if指令的表达式还支持一个可选的参数作为当前项的索引。
当我们在渲染一个列表时，判断某些项是否渲染时，我们可以使用v-if和v-for同时使用。我们需要注意的是当两个同时在一个元素上使用时，v-if的优先级是高于v-for的。这也就是说v-if的条件不能访问v-for范围内的变量。
v-bind
v-bind主要是用于将一个或者多个属性或一个组件的props动态绑定到表达式。简写为:。v-bind指令还可以绑定一个包含属性名-值对的对象。使用时该指令不需要接收参数，直接使用就行。
v-bind="forData"
v-model
v-model指令用于双向绑定。用于监听用户输入事件并更新数据。当我们在input中有内容时，我们可以在浏览器控制台中输入控件内容，并且当我们在console中修改内容时，页面中对应的控件内容也会发生改变。该指令多用于表单控件。
