子元素不继承父元素中的点击事件

如下图一行表格中有两个点击事件:

1. 点击某一行时,需要跳转页面跳转;

2. 点击删除按钮时,删除该行;

当我点击删除按钮后,不仅触发了自己的点击事件,也跳转了页面。

原因:这是由于子元素继承了父元素身上的方法。

解决方法:给子元素也就是图中的删除按钮给一个  event.stopPropagation() 的方法,来阻止事件冒泡就OK了。这样就不会相互影响了。

后续补充:

在vue中我们可以直接给点击事件一个stop修饰符就可以解决:

eg:@click.stop="hlandClick()"

你可能感兴趣的:(子元素不继承父元素中的点击事件)