思路如下:
1.给复选框定义一个类型,type="selection"
2.在点击函数中就可以使用判断条件来进行复选框的阻止冒泡。
rowDetailShow(row, event, column) {
if(column.type !== 'selection') {
this.selectedItem = row
this.detailShow = true
}
this.tableIndex = row.tableId
},
这样是一种方法,因为复选框一般都是与表格同步存在的。
还有一种简单的方法,就是在@click的后面加.stop,就成了这样,@click.stop="collectStar",这个知识点关联的是,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>
<!-- 只当事件在该元素本身(而不是子元素)触发时触发回调 -->
<div v-on:click.self="doThat">...</div>

这里就先谈这些,有些深层次的东西,待接触到再深究。

vue 表格阻止父元素冒泡事件的更多相关文章

  1. jquery父元素和子元素点击事件传递问题_不可把父元素的事件传递给子元素_事件无限循环传递

    前述:jquery中: 当一个元素的点击事件被触发时,会自动将该事件向父级元素逐级专递. 但是实际场景当中,我们可能会遇到需要在父级元素中定义点击事件,来触发特定子元素的点击事件,我就遇到了这么一个问 ...

  2. js原生子级元素阻止父级元素冒泡事件

    <html> <head> <style type="text/css"> #hide{ width:75%;height:80px;backg ...

  3. Javascript禁止子元素继承父元素的事件

    3种方法1.在父元素事件的function中加if(event.target==this){ }2.子元素事件function最后加event.stopPropgation():// 阻止事件冒泡3. ...

  4. jquery如何阻止子元素继承父元素的事件(又称事件冒泡)

    非常简单,子元素上添加如下代码即可 $('a').click(function(e){ e.stopPropagation(); }); 老版本为event,现在用e就行

  5. 实例化vue之前赋值html元素导致事件失效

    先实例化Vue对象,再操作其他对象,Vue对象声明时会渲染html容器内的所有元素, 会导致元素事件失效或dom元素重新创建,所以涉及html元素的对象都要在实例化Vue之后执行. 下面是简要的例子, ...

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

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

  7. embed标签 阻止点击事件 让父元素处理点击事件

    由于规定页面显示的PDF文件要有固定大小,使得页面风格统一 最开始发现了CSS样式pointer-events 写出如下代码,在360急速浏览器急速模式中访问可在点击PDF控件时可跳转页面 <a ...

  8. jquery阻止元素冒泡的两种方法

    通常情况下,如果给父元素添加事件之后,子元素也会继承同样的事件,这个时候就要阻止子元素的这种行为,成为阻止冒泡,总结两种解决方法: html代码: <div id="parent&qu ...

  9. Javascript事件模型(二):Javascript事件的父元素和子元素

    DOM事件标准定义了两种事件流,分别是捕获和冒泡.默认情况下,事件使用冒泡事件流,不使用捕获事件流.你可以指定使用捕获事件流,方法是在注册事件时传入useCapture参数,将这个参数设为true. ...

随机推荐

  1. svmtrain输入参数介绍【转】

    -s svm类型:SVM设置类型(默认0) 0 -- C-SVC 1 --v-SVC 2 – 一类SVM 3 -- e -SVR 4 -- v-SVR -t 核函数类型:核函数设置类型(默认2) 0 ...

  2. Delphi Dataset CurValue

    TField.CurValue Property Represents the current value of the field component including changes made ...

  3. Foundation框架—时间输出格式NSDateFormatter

    在开发iOS程序时,有时候需要将时间格式调整成自己希望的格式,这个时候我们可以用NSDateFormatter类来处理.下面来介绍NSDateFormatter的常用属性和API:  1.常用属性 @ ...

  4. Python面向对象—类属性和实例属性

    属性:就是属于一个对象的数据或函数元素 类有类方法.实例方法.静态方法.类数据属性(类变量)和实例数据属性(实例变量). 类属性:包括类方法和类变量,可以通过类或实例来访问,只能通过类来修改. 实例属 ...

  5. BZOJ4259:残缺的字符串——题解

    https://www.lydsy.com/JudgeOnline/problem.php?id=4259 很久很久以前,在你刚刚学习字符串匹配的时候,有两个仅包含小写字母的字符串A和B,其中A串长度 ...

  6. BZOJ2668 [cqoi2012]交换棋子 【费用流】

    题目链接 BZOJ2668 题解 容易想到由\(S\)向初始的黑点连边,由终态的黑点向\(T\)连边,然后相邻的点间连边 但是这样满足不了交换次数的限制,也无法计算答案 考虑如何满足一个点的交换次数限 ...

  7. HDOJ.1029 Ignatius and the Princess IV(map)

    Ignatius and the Princess IV 点我跳转到题面 点我一起学习STL-MAP 题意分析 给出一个奇数n,下面有n个数,找出下面数字中出现次数大于(n+1)/2的数字,并输出. ...

  8. Numpy模块(数值计算)

    Numpy是高性能科学计算和数据分析的基础包.它是pandas等其他各种工具的基础. NumPy的主要功能: ndarray,一个多维数组结构,高效且节省空间 无需循环对整组数据进行快速运算的数学函数 ...

  9. Django Model 数据表

    Django Model 定义语法 版本:1.7主要来源:https://docs.djangoproject.com/en/1.7/topics/db/models/ 简单用法 from djang ...

  10. 监听scrollview

    http://blog.csdn.net/u012527802/article/details/47320009