首页 > 其他分享 >vue中事件修饰符.prevent.self和.self.prevent有什么区别

vue中事件修饰符.prevent.self和.self.prevent有什么区别

时间:2023-05-18 16:23:11浏览次数:34  
标签:prevent self 修饰符 阻止 冒泡 事件

v-on:click.prevent.self:会阻止所有的点击,阻止了自身的默认事件和阻止了子元素事件的向上冒泡。
v-on:click.self.prevent:只会阻止对元素自身的点击,阻止了子元素事件的向上冒泡,阻止了子组件冒泡事件的默认事件。

在Vue.js中,事件修饰符.prevent用于阻止事件的默认行为,.self用于阻止事件冒泡。当.prevent和.self修饰符一起使用时,它们的顺序会影响事件监听器的行为。

.prevent.self表示阻止事件的默认行为,并阻止事件冒泡。在事件被触发时,.prevent修饰符将首先生效,阻止事件的默认行为。然后,.self修饰符将生效,阻止事件冒泡。因此,事件将被完全阻止,不会触发任何其他元素的事件监听器。

.self.prevent表示阻止事件冒泡,并阻止事件的默认行为。在事件被触发时,.self修饰符将首先生效,仅在事件在绑定的元素本身触发时生效,并阻止事件冒泡。然后,.prevent修饰符将生效,阻止事件的默认行为。因此,事件将被阻止冒泡,但是默认行为仍然会被触发。


.stop和.self有什么区别

.stop会阻止事件冒泡和默认行为,而.self仅会阻止事件冒泡。
.stop适用于需要完全停止事件传播的情况,而.self适用于仅在绑定元素本身触发事件时阻止事件冒泡的情况。

标签:prevent,self,修饰符,阻止,冒泡,事件
From: https://www.cnblogs.com/crispyChicken/p/17412317.html

相关文章

  • Self-attention
    1.问题提出全连接神经网络(FCN),可以很好的处理输入为1个向量(特征向量)的情况,但是如果输入是一组向量,FCN处理起来不太方便以词性标记的问题为例对于处于同一个句子中的相同的2个单词saw,词性不同,前者为动词(V),后者为名词(N)如果尝试使用FCN去解决这个问题,将每个单词转化为向量输入FCN,......
  • Java public、protected、default和private四种修饰符区别
    一、相同点都是修饰符二、不同点访问权限不同public任何地方都可以访问,被其修饰的类、属性以及方法不仅可以跨类访问,而且允许跨包(package)访问。****protected修饰符,权限介于public与default之间。被其修饰的类、属性以及方法只能被类本身的方法及子类访问,即使子类......
  • A User Account Restriction Is Preventing You From Logging On
    AUserAccountRestrictionIsPreventingYouFromLoggingOn Theerrormessage"Youcannotloginduetoaccountrestrictions"isdisplayedwhenyoulogintothesystemusingtheremotedesktopfunction.Thisisbecau......
  • c# 封装sealed修饰符
    使用sealed修饰的类,标识封装类,不能被继承,如classb不能被其他类继承;classA{}sealedclassB:A{}也能用sealed修饰重写的虚方法或属性,如下所示,Y类重写了X类的虚方法,并用sealed修饰F方法,那么,Z类就无法重写F方法,所以可以阻止后代重写sealed修饰的方法和属性;classX{prot......
  • 【Java】非访问修饰符 final、static 、abstract
    非访问修饰符final修饰符final可以修饰类、属性和方法<但不能用于修饰构造方法>private不能被子类方法覆盖,private类型的方法默认是final类型的 final修饰的变量有三种:静态变量、实例变量和局部变量,分别表示三种类型的常量。Tips:final变量定义的时候,可以先......
  • 访问修饰符
    在Java中,方法的默认访问权限是"package-private"(也称为"default"或"packageaccess")。这意味着如果没有指定任何访问修饰符,方法将具有默认访问权限。默认访问权限限制了方法只能在同一个包(package)内部被访问和调用,而在包的外部是不可见的。具有默认访问权限的方法可以被同一个包......
  • 李宏毅self-attention笔记
     面对的问题是什么?复杂输入,多个变长的向量这里自然会想到RNN,后面会有比较具体的场景,可以是一段话,每个word一个向量,可以用onehot,但大多时候是用embedding可以是一段印频,每25ms一个向量,按10ms滑动,可以看出音频的数据量是非常大的也可以是一张图片。。。输出当然有多种形......
  • rust中的self与Self
    selfself是一个代表类型实例(或者是类型的引用或者是值)的关键字,在Rust的方法中使用self可以引用当前类型的实例或者类型本身。具体来说,当我们定义一个方法时,使用self关键字作为方法的第一个参数可以让我们在调用该方法时直接访问类型实例本身structPoint{x:f32,......
  • Python很多时候要从键盘连续输入一个数组,并用空格隔开;Python爬取一些数据;python pip安
    Python要从键盘连续输入一个数组,并用空格隔开,Python中的实现方法如下:str=input(‘以空格为间隔连续输入一个数组:’)然后在键盘中输入,会·得到的str为一个字符串,要将其转为一个列表有两种方法方法一:a=[int(n)forninstr_in.split()]方法二:a=list(map(int,str.strip().sp......
  • SelfCAD:免费云端三维建模软件
    推荐:将NSDT场景编辑器加入你的3D工具链3D工具集:NSDT简石数字孪生SelfCAD是一款基于云端的三维建模软件,它是一个全功能的CAD软件,具有易于使用的界面和强大的工具,适合初学者和专业设计师使用。以下是SelfCAD的详细介绍:云端软件:SelfCAD是一个基于云端的软件,意味着您无需下载和安装......