vue中阻止事件穿透的方法
默认情况下,事件在h5页面会穿透传递,比如一div里面套一个div,点击上层div,下层div也会响应
要阻止事件穿透,使用event.stopPropagation();
代码示例:
<div @click="testout($event)>
<div @click="testin($event)"></div>
</div>
.......
testin(event) {
......
event.stopPropagation();
},
vue中阻止事件穿透的方法的更多相关文章
- Windows Server 2008中关闭事件跟踪程序的方法
Windows Server 2008跟Windows Server 2003一样,在关机的时候会弹出一个“关闭事件跟踪程序”窗口,当然微软这么做是处于安全的考虑啦,但是如果我们只是个人用用的话,那就 ...
- 在C++Builder中定义事件的实现方法
++Builder是由Borland公司推出的一款可视化集成开发工具.C++Builder的集成开发环境(IDE)提供了一系列可视化快速应用程序开发(RAD)工具,让程序员可以很轻松地建立和管理自己的 ...
- VUE中CSS样式穿透
VUE中CSS样式穿透 1. 问题由来 在做两款H5的APP项目,前期采用微信官方推荐的weui组件库.后来因呈现的效果不理想,组件不丰富,最终项目完成后全部升级采用了有赞开发的vant组件库.同时将 ...
- Vue中的事件与常见的问题处理
Vue的事件:获取事件对象$event: 事件冒泡:事件会向上传播 原生js阻止事件冒泡,需要先获取事件对象,再调用stopPropagation()方法: vue事件修饰符stop,例@clik.s ...
- vue中的事件修饰符
vue提倡的是在方法中只有对数据的处理,所以提供了事件修饰符用于DOM的事件处理,常用的事件修饰符有以下几个: (1). stop:阻止冒泡(通俗讲就是阻止事件向上级DOM元素传递) 点击内层div的 ...
- Vue_(基础)Vue中的事件
Vue.js中文文档 传送门 Vue@事件绑定 v-show:通过切换元素的display CSS属性实现显示隐藏: v-if:根据表达式的真假实现显示隐藏,如果隐藏,它绑定的元素都会销毁,显示的时候 ...
- React 中阻止事件冒泡的问题
在正式开始前,先来看看 JS 中事件的触发与事件处理器的执行. JS 中事件的监听与处理 事件捕获与冒泡 DOM 事件会先后经历 捕获 与 冒泡 两个阶段.捕获即事件沿着 DOM 树由上往下传递,到达 ...
- vue中滚动事件绑定的函数无法调用问题
问题描述: 一个包含下拉加载的页面,刷新当前页然后滚动页面,能够正常触发滚动事件并调用回调函数,但是如果是进了某一个页面然后再进的该页面,滚动事件能够触发, 但是回调函数在滚动的时候只能被调用一次. ...
- vue.js阻止事件冒泡和默认事件
首先我们来看原生JS取消事件冒泡方法: e.stopPropagation(); //非IE浏览器window.event.cancelBubble = true; //IE浏览器 原生JS阻止默认事 ...
随机推荐
- 理解Stream(一)——串行与终止操作
Java 8 stream特性是一个能快速降低开发人员工作量的语法糖,用起来很简单,用好了很难.这里就通过一系列的博客对几个常见的错误进行解释说明,并给出替代方法.这里先说明串行和终止操作. 首先,给 ...
- 三分钟网络基础-ARP协议
什么是 ARP 协议 地址解析协议 ARP (Address Resolution Protocal):在同一局域网下,根据已知道的主机或路由器的 IP 地址,找出其相应的硬件地址. 高速缓存 每一个 ...
- django restful 序列化
https://www.cnblogs.com/wt7018/p/11456440.html https://www.cnblogs.com/wt7018/p/11530962.html
- python 进程Queue
1.作用:进程之间的数据交互 2.常用方法 """ 对象.put() 作用:放入队列一个数据 对象.get() 作用:取队列一个数据,若队列没有值,则阻塞 对象.empt ...
- equals()和hashCode()必须同时覆盖的原因
我们在用JAVA创建自己的类的时候,一种比较常见的覆盖就是覆盖Object中的equals()方法和hashCode()方法.如果不这样做的话,就很可能违反Object.hashCode()的通用约定 ...
- 用Kolla在阿里云部署10节点高可用OpenStack
为展现 Kolla 的真正实力,我在阿里云使用 Ansible 自动创建 10 台虚机,部署一套多节点高可用 OpenStack 集群! 前言 上次 Kolla 已经表示了要打 10 个的愿望,这次我 ...
- 工作笔记-- 源码安装nginx
源码安装nginx 1.安装nginx的依赖包 [root@localhost ~]# yum -y install gcc gcc-c++ openssl openssl-devel pcre pc ...
- selenium2-Python环境搭建
一.什么是selenium? selenium主要用于web应用的自动化测试,但并不局限于此,它还支持基于所有web的管理任务自动化,且开源免费,多浏览器支持(IE,Mozilla Firefox,S ...
- Linux网络文件共享服务之smaba
一.SAMBA服务简介 samba是1991年由Andrew Tridgel开发实现,主要用于Windows和unix文件共享.samba实现了共享文件和打印,实现在线编辑,登录SAMBA用户的身份认 ...
- java内存模型梳理
java内存模型 内存模型和内存结构区别 它们是两个概念. 内存模型是和jvm多线程相关的. 内存结构是指的jvm内存结构. 内存模型的作用 内存模型简称JMM JMM是决定一个线程对共享变量的写入时 ...