Vue 中阻止冒泡和默认事件_vue3 elementplus input 阻止默认事件

作者：不正经 | 2024-02-13 02:14:55

踩

vue3 elementplus input 阻止默认事件

使用原生的方式来阻止冒泡和默认事件很多人都知道了，而 Vue 虽然是数据驱动的 MVVM 框架，但是在项目需要的时候仍然要阻止冒泡和默认事件。一般的做法比如

<div>
  <div @click="show($event)"></div>
</div>

// 这里简写了
methods: {
  show (event) {
    // 阻止冒泡
    event.stopPropagation();
    // 阻止默认事件
    event.preventDefault();
  }
}1
2
3
4
5
6
7
8
9
10
11
12
13

Vue 提供了更加方便的写法来实现：

<!-- 阻止冒泡 -->
<div>
  <div @click.stop="show()"></div>
</div>

<!-- 阻止默认事件 -->
<div>
  <div @click.prevent="show()"></div>
</div>1
2
3
4
5
6
7
8
9

更多的玩法等待挖掘…

声明：本文内容由网友自发贡献，转载请注明出处：【wpsshop博客】