2024年06月18日 建站教程
Vue.js的指令修饰符是由指定的特殊后缀,用于指令的特殊行为。通常用于 .prevent、.stop、.self、.once等。使用修饰符的好处:1、可以避免在指令中使用过度复杂的 JavaScript 逻辑。2、提高模板的可读性。
.prevent指令修饰符的使用(调用 event.preventDefault() 阻止默认事件)
<form v-on:submit.prevent="onSubmit"></form>
.stop指令修饰符的使用(调用 event.stopPropagation() 阻止事件冒泡)
<div v-on:click="doThis"> <button v-on:click.stop="doThat"></button> </div>
.self指令修饰符的使用(只有 event.target 是当前元素自身时才触发处理函数)
<div v-on:click.self="doThat">...</div>
.once指令修饰符的使用(只触发一次处理函数)
<div v-on:click.self="doThat">...</div>
.native指令修饰符的使用(监听组件根元素的原生事件)
<my-component v-on:click.native="doTheNativeClick"></my-component>
.passive指令修饰符的使用(告诉浏览器你不想阻止默认行为)
<div v-on:scroll.passive="onScroll">...</div>
本文链接:http://so.lmcjl.com/news/6797/