vue如何阻止事件冒泡/取消默认事件
.stop.prevent出现情况代码如下:<div @click="handle(item)" class="div1"><div @click="handle(el)" class="div2"></div></div>handle(el) {console.log(el) // div1点击打印div1值,div2点击分别打印div1,div2
·
.stop
.prevent
出现情况代码如下:
<div @click="handle(item)" class="div1">
<div @click="handle(el)" class="div2"></div>
</div>
handle(el) {
console.log(el) // div1点击打印div1值,div2点击分别打印div1,div2的值
}
想要只打印当前点击的值,就需要阻止事件冒泡,在vue中,我们这样绑定事件可以实现
<div @click.stop="handle(item)" class="div1">
<div @click.stop="handle(el)" class="div2"></div>
</div>
// 下面这段可以取消默认事件
<div @click.prevent="handle(item)" class="div1">
<div @click..prevent="handle(el)" class="div2"></div>
</div>
更多推荐
已为社区贡献25条内容
所有评论(0)