vue中阻止input冒泡
时间: 2023-10-30 13:01:10 浏览: 117
在Vue中阻止input的事件冒泡,可以使用`.stop`修饰符。`.stop`修饰符可以阻止当前元素的事件继续向外触发,即阻止冒泡行为。在你提供的代码中,可以在input元素的事件中添加`.stop`修饰符来实现阻止冒泡。例如,可以将代码修改为:
```html
<div @click.self="show()" style='height: 100px;background: yellow;width: 100px;'>
<input type="text" @click.stop />
</div>
```
这样,在点击input元素时,不会触发父元素的点击事件。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *3* [VUE中如何阻止事件冒泡](https://blog.csdn.net/qq_17355709/article/details/112740392)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
- *2* [vue 阻止输入框冒泡](https://blog.csdn.net/weixin_38641550/article/details/83988896)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]
阅读全文