官网有一个提醒:使用修饰符时,顺序很重要;相应的代码会以同样的顺序产生。因此,用 v-on:click.prevent.self 会阻止所有的点击,而 v-on:click.self.prevent 只会阻止对元素自身的点击。

@click.prevent.self =“c”  总是先执行prevent,无论是内部元素还是本身元素触发,他都会prevent默认事件。只不过只有当你点击a元素的时候,才会触发c事件,因此会阻止所有的点击

@click.self.prevent =“c” 当你点击的元素是a的时候,才会prevent默认事件,而且执行c事件,因此只会阻止对元素自身的点击。

对官网vue事件修饰符串联的顺序如何理解?的更多相关文章

  1. Vue—事件修饰符

    Vue事件修饰符 Vue.js 为 v-on 提供了事件修饰符来处理 DOM 事件细节,如:event.preventDefault() 或 event.stopPropagation(). Vue. ...

  2. vue事件修饰符(once:prev:stop)

    vue事件修饰符(once:prev:stop) stop修饰符  效果如下: 当你鼠标在这个div里的时候,x与y的值:会随着鼠标的变化而变化.但是当鼠标放在stopMoving的时候,x与y的值是 ...

  3. Vue2.0学习笔记:Vue事件修饰符的使用

    事件处理 如果需要在内联语句处理器中访问原生DOM事件.可以使用特殊变量$event,把它传入到methods中的方法中. 在Vue中,事件修饰符处理了许多DOM事件的细节,让我们不再需要花大量的时间 ...

  4. Vue事件修饰符详解

    整体学习Vue时看到Vue文档中有事件修饰符的描述,但是看了之后并没有理解是什么意思,于是查阅了资料,现在记录下来与大家分享 先给大家画一个示意图理解一下冒泡和捕获 (1) .stop修饰符 请看如下 ...

  5. vue事件修饰符与按钮修饰符

    事件修饰符:(当事件无需传参数时可直接写成以下形式,有参数时则为@click.stop="handleLiClick($event)") stop:阻止事件冒泡行为(子元素被点击, ...

  6. vue 事件修饰符(阻止默认行为和事件冒泡)

    1. 原生js中,阻止事件冒泡,获取点击对象, e.stopPropagation(); 2. vue阻止事件冒泡@click.stop="show" <body> & ...

  7. vue事件修饰符

    阻止单击事件冒泡 <a v-on:click.stop="doThis"></a>提交事件不再重载页面<form v-on:submit.preven ...

  8. Vue事件修饰符,.capture关键字详解

    .prevent 用于阻止默认事件,点击a标签href可以打开相应的链接,那么给事件加    上此关键字,click.prevent .capture 冒泡顺序    例如 div1中嵌套div2中嵌 ...

  9. vue 事件修饰符

    1.用.stop来阻止冒泡(点击click按钮之后,先执行clickBtn2方法,然后执行clickBtn1方法,.stop命令阻止了clickBtn1方法的执行) 2.使用.prevent命令来阻止 ...

随机推荐

  1. EBS R12.2系统logo的修改

    https://blog.csdn.net/lzl1101206656/article/details/74171999 EBS系统logo的修改 转载lzl1101206656 发布于2017-07 ...

  2. JAVA中对象的克隆及深拷贝和浅拷贝

    使用场景: 在日常的编程过程 中,经常会遇到,有一个对象OA,在某一时间点OA中已经包含了一些有效值 ,此时可能会需一个和OA完全相对的新对象OB,并且要在后面的操作中对OB的任何改动都不会影响到OA ...

  3. 美团Java工程师面试题(2018秋招)

    第一次面试 1.小数是怎么存的 2.算法题:N二进制有多少个1 3.Linux命令(不熟悉 4.JVM垃圾回收算法 5.C或者伪代码实现复制算法 6.volatile 7.树的先序中序后序以及应用场景 ...

  4. 【问题】Debian安装、配置sources.list、安装VMware Tools

    Debian安装: 我采用的是纯命令行安装方式.具体安装过程网上一大堆,不介绍了.需要强调一点,那个SSH Server必须选,否则像XShell这样的客户端不能访问Debian. 配置sources ...

  5. sqlplus set相关设置

    Oracle里的set零零碎碎的,这里整理归纳一下 SQL> set timing on;          //设置显示“已用时间:XXXX” SQL> set autotrace on ...

  6. 标准库类型之vector

    上篇中遗留了一个小作业,就是用string中的find_first_not_of和find_last_not_of函数来实现字符串左右空格的去除,先来完成它,实现的思路是先来编写去除左空格,然后再编写 ...

  7. Disconnected from the target VM, address: '127.0.0.1:56577', transport: 'socket'

    Disconnected from the target VM, address: '127.0.0.1:56577', transport: 'socket' Disconnected from t ...

  8. .NET界面开发新体验!DevExpress v19.2.4全新来袭

    DevExpress Universal Subscription(又名DevExpress宇宙版或DXperience Universal Suite)是全球使用广泛的.NET用户界面控件套包,De ...

  9. django中非菜单权限的归属

    非菜单权限的归属 :         1.设置表结构 : 在权限表中添加自连接的外键patent,parent_id连接permission表的id,可为空,当有parent_id时,说明它是一个普通 ...

  10. 2019牛客多校D move——乱搞&&思维题

    题意 给定 $n$ 个物品,体积分别为 $v_i$,现有 $K$ 的容积一样的箱子,按如下策略装入物品:每次选取尽可能大的装入(较大的不能装入时可以向小的找),依次装入箱子. 分析 首先,不具有严格的 ...