vue.js中修饰符.stop的用法解析

修饰符.stop的用法

.stop修饰符是用来阻止冒泡事件的发生的。

用法如下

下面是全部的代码




    
    Title
    



//--------------------------------重点是这一部分代码。
   
        百度     //点击百度的时候不发生冒泡,执行doThis函数,然后跳转到百度首页。    
    //点击粉色部分,即pa部分,发生冒泡,执行doThat,dodo函数。

stop事件修饰符

修饰符 说明
.stop 阻止冒泡

stop事件修饰符具体介绍

.stop

.stop用来防止冒泡




    
    
    
    Document
    
    


    
    

页面操作效果

vue.js中修饰符.stop的用法解析_第1张图片

我们看到不光点击按钮的点击事件触发了,而且父容器div的点击事件也触发了,这时我们就可以使用.stop来阻止这个冒泡了,如下

vue.js中修饰符.stop的用法解析_第2张图片

在访问测试

vue.js中修饰符.stop的用法解析_第3张图片

通过输出可以看到点击事件没有往上冒泡了!

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

你可能感兴趣的:(vue.js中修饰符.stop的用法解析)