重点 vue事件修饰符

<!-- 阻止单击事件冒泡 -->
<a v-on:click.stop="doThis"></a> <!-- 提交事件不再重载页面 -->
<form v-on:submit.prevent="onSubmit"></form> <!-- 阻止默认事件 -->
<a v-on:click.stop.prevent="doThat"></a> <!-- 只有修饰符 -->
<form v-on:submit.prevent></form> <!-- 添加事件监听器时使用事件捕获模式 -->
<!-- 即元素自身触发的事件先在此处理,然后才交由内部元素进行处理 -->
<div v-on:click.capture="doThis">...</div> <!-- 只当在 event.target 是当前元素自身时触发处理函数 -->
<!-- 即事件不是从内部元素触发的 -->
<div v-on:click.self="doThat">...</div>

vue 事件上加阻止冒泡 阻止默认事件的更多相关文章

  1. js阻止冒泡和默认事件

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. js阻止冒泡和默认事件(默认行为)详解- jquery DefaultPrevented 函数

    <!DOCTYPE html> <html>     <head>     <meta charset="UTF-8">     & ...

  3. jQuery 阻止冒泡和默认事件

    jQuery event.preventDefault() 方法 event.preventDefault() 方法阻止元素发生默认的行为. 例如: 当点击提交按钮时阻止对表单的提交 阻止以下 URL ...

  4. 基本event封装:阻止冒泡、默认事件等

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> </head> ...

  5. js阻止元素的默认事件与冒泡事件

    嵌套的div元素,如果父级和子元素都绑定了一些事件,那么在点击最内层子元素时可能会触发父级元素的事件,从而带来一定的影响. 1. event.preventDefault();  -- 阻止元素的默认 ...

  6. 在FireFox浏览器上,用stopImmediatePropagation阻止冒泡鼠标滚动事件

    楔子 是不是在火狐用stopPropagation不太满意 很久没有笑过又不知为何 既然不快乐又不喜欢这里 不如一路向西用stopImmediatePropagation(其实我对浏览器的兼容性看不顺 ...

  7. h5 移动端在阻止touchstart的默认事件时报错

    h5 移动端在阻止touchstart的默认事件时报错 解决办法, 可以添加 *{ touch-action: none;}即可消除错误

  8. 前端(十五)—— JavaScript事件:绑定事件方式、事件的冒泡和默认事件、鼠标事件、键盘事件、表单 事件、文档事件、图片事件、页面事件

    JS事件:绑定事件方式.事件的冒泡和默认事件.鼠标事件.键盘事件.表单 事件.文档事件.图片事件.页面事件 一.事件的两种绑定方式 1.on事件绑定方式 document.onclick = func ...

  9. vue.js阻止事件冒泡和默认事件

    首先我们来看原生JS取消事件冒泡方法: e.stopPropagation(); //非IE浏览器window.event.cancelBubble = true; //IE浏览器 原生JS阻止默认事 ...

随机推荐

  1. SQL基本语句:1.模式 3.索引

    每次很长时间不用sql语句之后,都需要把基础的捡一捡,索性做个笔记,以后可以长看

  2. Functional programming-函数式编程

    In computer science, functional programming is a programming paradigm—a style of building the struct ...

  3. 3ds Max制作欧式风格的墙壁路灯效果

    在这篇文章中,我将解释我创建我的形象元宵节的步骤.我只是在寻找一个很好的参考图像在互联网上的东西,我觉得我想要的模型,这个形象.我发现了一个巨大的灯笼形象,但在白天的图片拍摄.我想改变我的形象和显示的 ...

  4. 汇编(assembling)简介(源:阮一峰)

    简介 计算机真正能够理解的是低级语言,它专门用来控制硬件.汇编语言就是低级语言,直接描述/控制 CPU 的运行.如果你想了解 CPU 到底干了些什么,以及代码的运行步骤,就一定要学习汇编语言. 我们知 ...

  5. Extjs toolbar 如何添加竖杆分隔符

    如下: { xtype:'button', text:'学生档案', iconCls:'file', handler:function(){ console.log(222) }, }, {xtype ...

  6. BZOJ 2342 [SHOI2011]双倍回文 (回文自动机)

    题目大意:略 先建出$PAM$ 因为双倍回文串一定是4的倍数,所以找出$PAM$里所有$dep$能整除4的节点 看这个串是否存在一个回文后缀,长度恰好为它的一半,沿着$pre$链往上跳就行了 暴跳可能 ...

  7. S3C6410 LCD Overlay Test Program

    测试了一下S3C6410 LCD控制器提供的Overlay功能,写了一个简单的test,主要用于实现FB0和FB1之间的Overlay操作.内核选项的Windows至少要为2. 具体支持如下操作:1 ...

  8. crm 系统项目(三) 自动分页

    crm 系统项目(三) 自动分页 需求: 1. 做一个自动分页, 每15条数据1页 2. 让当前页数在中间显示 3. 上一页, 下一页 注意情况: 1.总页数 小于 规定显示的页数 2. 左右两边极值 ...

  9. js数组并集,交集,差集

    js数组并集,交集,差集的计算方式汇总 一. new Set 方式实现 这种方式实现起来比较简单,原理就是参考new Set可以去重的功能 ,关于去重可以点击 https://www.haorooms ...

  10. BZOJ——1602: [Usaco2008 Oct]牧场行走 || 洛谷—— P2912 [USACO08OCT]牧场散步Pasture Walking

    http://www.lydsy.com/JudgeOnline/problem.php?id=1602 || https://www.luogu.org/problem/show?pid=2912 ...