Vue中的指令可以通过HTML中的特殊属性来使用。以下是Vue中的全部指令:
1. v-bind:绑定数据到HTML元素属性
2. v-model:实现表单元素和数据的双向绑定
3. v-if、v-else-if、v-else:控制元素是否显示
4. v-show:控制元素是否显示,与v-if的区别在于,v-show只是控制元素的display属性,不会动态创建或销毁DOM元素
5. v-for:循环渲染数据列表
6. v-on:绑定事件监听器
7. v-text:将数据渲染为元素的文本内容
8. v-html:将数据渲染为元素的HTML内容
9. v-pre:跳过该元素和它的子元素的编译过程
10. v-cloak:在Vue实例还未完全渲染前隐藏指令,直到实例准备完毕后才显示指令所在的元素
11. v-once:元素只渲染一次,一旦渲染完毕后指令就不再起作用
除了上述指令,Vue还提供了一些修饰符,可以通过在指令名后面加上修饰符来改变指令的行为,如:
1. .prevent:阻止默认行为
2. .stop:阻止事件冒泡
3. .capture:使用事件捕获模式
4. .self:只在事件目标自身触发时触发处理函数,如果事件从子元素冒泡上来则不触发
5. .once:只触发一次
6. .passive:告诉浏览器该事件监听器永远不会调用preventDefault方法,可以用来提高移动端滑动性能