Vue 中阻止冒泡和默认事件
使用原生的方式来阻止冒泡和默认事件很多人都知道了,而 Vue 虽然是数据驱动的 MVVM 框架,但是在项目需要的时候仍然要阻止冒泡和默认事件。
·
使用原生的方式来阻止冒泡和默认事件很多人都知道了,而 Vue 虽然是数据驱动的 MVVM 框架,但是在项目需要的时候仍然要阻止冒泡和默认事件。一般的做法比如
<div>
<div @click="show($event)"></div>
</div>
// 这里简写了
methods: {
show (event) {
// 阻止冒泡
event.stopPropagation();
// 阻止默认事件
event.preventDefault();
}
}
Vue 提供了更加方便的写法来实现:
<!-- 阻止冒泡 -->
<div>
<div @click.stop="show()"></div>
</div>
<!-- 阻止默认事件 -->
<div>
<div @click.prevent="show()"></div>
</div>
更多的玩法等待挖掘…
更多推荐
已为社区贡献10条内容
所有评论(0)