Vue使用v-on指令绑定事件,简写为@,其用在普通元素上时,只能监听原生 DOM 事件。用在自定义元素组件上时,也可以监听子组件触发的自定义事件。
1.修饰符
stop - 调用 event.stopPropagation(),停止冒泡。
prevent - 调用 event.preventDefault(),组织浏览器默认事件。
capture - 添加事件侦听器时使用 capture 模式。
self - 只当事件是从侦听器绑定的元素本身触发时才触发回调。
{keyCode | keyAlias} - 只当事件是从特定键触发时才触发回调。
native - 监听组件根元素的原生事件。
once - 只触发一次回调。
left - (2.2.0) 只当点击鼠标左键时触发。
right - (2.2.0) 只当点击鼠标右键时触发。
middle - (2.2.0) 只当点击鼠标中键时触发。
passive - (2.3.0) 以 { passive: true } 模式添加侦听器
2.示例
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
//在子组件上监听自定义事件 (当子组件触发“my-event”时将调用事件处理器):
|