What are the event modifiers in vue

Vue event modifiers: 1. stop: Prevent events from bubbling. 2. prevent: Prevent the default event behavior. 3. capture: Capture events in the capture phase. 4. self: Triggered only when the event occurs on the element itself. 5. once: The event is triggered only once, and then the listener is removed. 6. Passive: Does not prevent page scrolling or UI interaction. 7. lazy: Delay the creation of the listener until the element is added to the DOM. 8. debounce: trigger an event only once within a specified time (for example, @click.debounce.500). 9. throttle: trigger an event only once within a specified time interval (for example, @c

##Vue event modifier

stop

Prevent events from bubbling, that is, prevent events from propagating upwards
• Format:
• @click.stop

prevent

##Prevent default event behavior, such as form submission or link jump.

• Format:
@click.prevent#.
#capture

Capture events in the capture phase, not in the bubbling phase. The capture phase means that the event propagates upward from the target element. Stage triggered when the document root element is reached

Format:
• @click.capture
• ##self

##Only triggered when the event occurs on the element itself, not on its child elements Format:

@click.self

• # #once
##The event is only triggered once, and then the event listener is automatically removed.

Format: @click.once

• passive
Tells the browser not to prevent page scrolling or other user interface interactions

Format: @scroll.passive

• ##lazy
• Delay event listener creation until the relevant element is added to the DOM

Format:

@click.lazy

• debounce
• The event will only be triggered once within the specified time, even if there are many events in a short period of time

Format:

@click.debounce.500, where 500 is the number of milliseconds. ##The event is triggered only once within the specified time interval, even if the event is triggered multiple times within this time interval.

Format:
• @click.throttle.500
, where 500 is. Number of milliseconds.

The above is the detailed content of What are the event modifiers in vue. For more information, please follow other related articles on the PHP Chinese website!