v-on 自定义事件方法

用在普通元素上时，只能监听原生 DOM 事件。用在自定义元素组件上时，也可以监听子组件触发的自定义事件。

event.stopPropagation()

@click.stop

这是阻止事件的冒泡方法，不让事件向document上蔓延，但是默认事件任然会执行，当你掉用这个方法的时候，如果点击一个链接，这个链接仍然会被打开

<template>
<div>
  <a href="http://www.baidu.com" @click="prevent($event)">百度</a>
</div>
</template>

<script>
export default {
    data(){
        return{
        }
    },
    methods:{
        prevent(event){
            event.stopPropagation
            // event.preventDefault()
            console.log(event.type)
        }
    }
    
    
}
</script>

<style>

</style>

点击还是会跳转百度链接

event.preventDefault()

@click.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 } 模式添加侦听器