vue：常用指令、修饰符

1、列举常用指令以及作用

• V-for 循环（配合key使用，v-for： v-for="（item,index) in/of 数组json" 循环数组或json）
• v-on 绑定事件（缩写@，给标签绑定函数，例如绑定一个点击函数 函数必须写在methods里面）
• v-model 双向数据绑定（多用于表单元素实现双向数据绑定）
• v-text 渲染字符串（解析文本）
• v-html 渲染html节点及字符串
• v-if 判断（通过创建或删除DOM节点来实现元素的显示隐藏，v-else-if、v-else 必须和 v-if 连用）
• v-show 显示/隐藏（通过display:none来控制显示/隐藏）
• v-hide 隐藏内容 同上
• v-bind 绑定属性（可以动态的绑定class，style样式。作用： 及时对页面的数据进行更改）
• v-once 进入页面时 只渲染一次 不在进行渲染
• v-cloak 防止闪烁 该属性需配合 样式使用：[v-cloak]{display:none}
• v-pre 把标签内部的元素原位输出

2、列举出常用的修饰符

• @事件.stop 阻止事件冒泡（由于事件冒泡的机制，我们给元素绑定点击事件的时候，也会触发父级的点击事件）
• @事件.prevent 阻止事件默认行为（例如：当点击提交按钮时阻止对表单的提交。相当于调用了event.preventDefault()方法）
• @事件.capture 触发事件捕获（添加事件侦听器时使用事件捕获模式）
• @事件.self 当事件在该元素本身 触发回调
• @once 只执行一次（绑定了事件以后只能触发一次，第二次就不会触发）
• @事件.passive 告诉浏览器你不想阻止事件的默认行为（当我们在监听元素滚动事件的时候，会一直触发onscroll事件，在pc端是没啥问题的，但在移动端，会让我们的网页变卡，因此我们使用这个修饰符的时候，相当于给onscroll事件整了一个.lazy修饰符）
• @事件.native 的作用就是把一个vue组件转化为一个普通的HTML标签（注意：使用.native修饰符来操作普通HTML标签是会令事件失效的）

<!-- 阻止单击事件继续传播 -->
<a v-on:click.stop="doThis"></a>

<!-- 提交事件不再重载页面 -->
<form v-on:submit.prevent="onSubmit"></form>

<!-- 修饰符可以串联 -->
<a v-on:click.stop.prevent="doThat"><