在 Vue.js 中，事件冒泡（Event Bubbling）和捕获（Event Capturing）的概念与原生 JavaScript 中的事件传播机制类似。Vue 通过其 `.native` 修饰符（在 Vue 2.x 中用于监听组件根元素上的原生事件，Vue 3.x 已废弃 `.native` 修饰符，因为 Vue 3 使用了基于函数的组件 API，原生事件监听直接绑定在模板上）和自定义事件系统提供了对事件处理的支持，但对于 DOM 事件本身的冒泡和捕获机制，Vue 并没有提供直接的修饰符来控制。不过，你仍然可以通过原生 JavaScript 的方式来实现这一需求。
### Vue 2.x 中处理 DOM 事件的冒泡和捕获
在 Vue 2.x 中，虽然 `.native` 修饰符用于监听组件根元素上的原生事件，但它本身并不控制事件的冒泡或捕获。要控制这些行为，你需要在事件监听函数中手动处理。
#### 捕获（Capturing）
要在 Vue 中模拟捕获模式，你需要在原生 DOM 上直接添加事件监听器，并设置第三个参数为 `true`。这通常在 Vue 组件的 `mounted` 钩子中完成：
```javascript
mounted() {
this.$el.addEventListener('click', this.handleClick, true); // 第三个参数为 true 表示捕获模式
},
beforeDestroy() {
this.$el.removeEventListener('click', this.handleClick, true); // 清理
},
methods: {
handleClick(event) {
// 处理事件
}
}
```
#### 冒泡（Bubbling）
对于冒泡模式，你不需要特别指定，因为冒泡是 DOM 事件的默认行为。在 Vue 组件的模板中监听事件时，默认就是冒泡模式：
```html
点击我
```
### Vue 3.x 中处理 DOM 事件的冒泡和捕获
在 Vue 3 中，处理 DOM 事件的冒泡和捕获的方式与 Vue 2 类似，但由于 `.native` 修饰符已被废弃，直接在模板上监听原生事件变得更加直接：
#### 捕获（Capturing）
同样地，你需要在组件的 `mounted` 钩子中手动添加监听器，并指定为捕获模式：
```javascript
mounted() {
this.$el.addEventListener('click', this.handleClick, true);
},
beforeUnmount() { // Vue 3 中使用 beforeUnmount
this.$el.removeEventListener('click', this.handleClick, true);
},
methods: {
handleClick(event) {
// 处理事件
}
}
```
#### 冒泡（Bubbling）
与 Vue 2 相同，Vue 3 中监听事件默认也是冒泡模式：
```html
点击我
```
### 结论
Vue 本身不直接提供修饰符来控制 DOM 事件的冒泡和捕获，但你可以通过原生 JavaScript 的方式在 Vue 组件的生命周期钩子中添加或移除事件监听器，并指定捕获或冒泡模式。