vue中关于click.stop的用法_vue.js_

关于click.stop的用法

click.stop 阻止点击事件继续传播

场景：

在table中使用，点击当前行，当前行被勾选，但是点击当前行中按钮或点击事件时，使用此方法，则在触发当前点击事件后，阻止行的选中事件

使用：

html

页面效果：

@click.stop与@click.prevent

一、@click.stop

问题：父元素中添加了一个click事件，其下面的子元素中也添加了click事件，此时，我想点击子元素获取子元素的点击事件，但却触发的是父元素的事件：

         喜欢         评论         分享

此时，我们就需要使用@click.stop：阻止事件冒泡方法来解决这个问题：

         喜欢         评论         分享

二、@click.prevent

还有一个与之相似的方法：@click.prevent：阻止事件的默认行为，例如：在代码里写入一个a标签，点击会跳转到目标链接网页中：

     百度

但如果我们不想让它跳转但还想使用a标签的话，此时就需要使用@click.prevent方法：

     百度

这时再点击a标签的时候就不会跳转目标地址链接了。 

以上为个人经验，希望能给大家一个参考，也希望大家多多支持。

提示： 本文由神整理自网络，如有侵权请联系本站删除！
本站声明：
1、本站所有资源均来源于互联网，不保证100%完整、不提供任何技术支持；
2、本站所发布的文章以及附件仅限用于学习和研究目的;不得将用于商业或者非法用途；否则由此产生的法律后果，本站概不负责！