vue数据事件修饰符

vue数据在嵌套div的时候会产生冒泡，既点击了下层的div标签，上层也会出发点击效果。如何防止呢，使用click.stop即可

<div id="app">
    <div class="parent" @click="parentClick">
        <div class="sub" @click.stop="subClick" >
            <div class="child" @click.stop="childClick">

            </div>
        </div>
    </div>

</div>

阻止默认事件

<a href="http://www.baidu.com" @click.prevent="aClick" >baidu</a>

click.self 只有在自己身上触发的时候才执行

<div id="app">
    <div class="parent" @click="parentClick">
        <div class="sub" @click.self="subClick" >
            <div class="child" @click.stop="childClick">

            </div>
        </div>
    </div>
    <a href="http://www.baidu.com" @click.prevent="aClick" >baidu</a>

</div>

edit by cherrydot