vue點擊事件@click.stop(阻止冒泡).native

大家都知道，vue中點擊事件直接在元素中使用@click="click"即可，但是有時在一個元素中包含了子元素，而且父元素和子元素都有點擊事件，此時我們希望的點擊效果就是：點擊子元素區域的的時候，不觸發父級元素的點擊事件，此時就要用到@click.stop="subclick"。

@click.stop與@click.prevent

@click.stop 阻止事件冒泡

@click.prevent 阻止事件的默認行為，

1 2 3 4

< a  href = "http://www.baidu.com"  @ click.prevent = "test4" >百度一下</ a >   //阻止a標簽跳轉，僅執行函數test4 < form   action = "/xxx"    @ submit.prevent = "test5" >   //阻止表單提交，僅執行函數test5     < input  type = "submit"  value = "注冊" > </ form >

 

vue @click.native 原生點擊事件：

1，給vue組件綁定事件時候，必須加上native ，不然不會生效（監聽根元素的原生事件，使用 .native 修飾符）

2，等同於在自組件中：

   子組件內部處理click事件然后向外發送click事件：$emit("click".fn)