Event modifier
Cn.vuejs.org/v2/guide/ev…
<! Continue to spread, stop the click event - - > < v - on a: click. Stop = "doThis" > < / a > <! <form V-on :submit. Prevent ="onSubmit"></form> <! - the modifier can series - > < v - on a: click. Stop. Prevent = "doThat" > < / a > <! <form V-on :submit. Prevent ></form> <! -- Use event capture mode when adding event listeners --> <! <div V-on :click.capture="doThis"> <div V-on :click.capture="doThis"> </div> <! Trigger handler only if event.target is the current element itself --> <! <div v-on:click.self="doThat">... </div> <! - click event will only trigger a - > < v - on a: click once = "doThis" > < / a >Copy the code
When using modifiers, order is important; The corresponding code is generated in the same order. Therefore, using V-on :click.prevent. Self blocks all clicks, whereas V-on :click.self. Prevent only blocks clicks on the element itself.