First, the event modifier
vue provides a modifier for the event or @ v-on way to call modifiers by point (.) suffix of instruction. The v-on: click.stop.
.stop prevent the event from bubbling out
.prevent prevent the default behavior
.capture event bubbling change event capture mode
.self only trigger their default behavior, which means that only e.target === e.currentTarget will be performed.
.once performed only once, followed by real-time data changes I no longer re-rendered.
.passive prevent the scroll bar behavior (commonly used in the mobile end)
.native (native event listener components of the root element, the main component is added to the custom of native events)
Event modifier in series: <a v-on:click.stop.prevent="doThis"> </a>
Second, the form modifier
This modifier is the role of the v-model form tag. The v-model.lazy
.lazy triggered after the change (that is to say only when the cursor leaves the input value input box will change)
.number the output string to Number type * (although type defines the type is the type of number, but if the input string, the output is string)
.trim trailing spaces are automatically filtered user input
Third, the keyboard modifiers
.enter: Enter key after typing, pressing enter will only trigger content
.tab: Tab key
.delete: containing the backspace key and delete
.esc: Back key
.space: spacebar
.up: up key
.down: Down keys
.left: Left arrow
.right: Right
Fourth, the system modifiers
Can be used as a modifier to achieve only trigger a mouse or keyboard event listener in the only press the corresponding button.
.ctrl
.alt
.shift
.meta
Such as: typing time, while pressing the shift to be useful.
Note: This modifier necessary to press two keys at the same time to be useful.
Fifth, mouse modifiers
.left
.right
.middle
Six custom modifier key aliases