uni-app事件冒泡 如何解决事件冒泡 推荐tap事件
冒泡事件##
冒泡事件
<view class="max-box" @tap="waimian">
外面
<view class="in-box" @tap="limain">里面</view>
</view>
waimian(){
console.log("外面")
},
limain(){
console.log("里面")
}
点击外面的时候,不会触发里面元素的事件
但是点击里面元素的时候,就会触发外面元素的事件,这就是冒泡哈!!
如何解决事件冒泡了
添加一个stop
<view class="in-box" @tap.stop="limain">里面</view>
就会阻止里面这个元素冒泡
在手机上 推荐使用的事件是tap
<view @tap="Hanldergo">按钮</view>
uni-app统一支持的是数据双向绑定哈
想要拿到data中的数据 可以直接去使用this.XXX就可以了
uni-app事件冒泡 如何解决事件冒泡 推荐tap事件的更多相关文章
- tap事件封装
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8 ...
- 解决内部元素onMouseOver/onMouseOut事件冒泡触发父元素的相应事件
前阵子为BS项目模板做了一个左侧滑动信息栏,效果类似于windows状态栏的自动隐藏效果,鼠标移进滑出,鼠标移出隐藏,浮动时不占用空间,也可以固定住占一块位置.做的过程中遇到一个问题,鼠标在信息栏内部 ...
- 一个DOM元素绑定多个事件时,先执行冒泡还是捕获
绑定在被点击元素的事件是按照代码顺序发生,其他元素通过冒泡或者捕获“感知”的事件,按照W3C的标准,先发生捕获事件,后发生冒泡事件.所有事件的顺序是:其他元素捕获阶段事件 -> 本元素代码顺序事 ...
- iPhone safari中Document事件不触发的解决方案 [冒泡]
写了一个下拉菜单,在单击空白地方的时候隐藏. 第一时间就是用$(document).click(function(){ //隐藏代码 }); 各大浏览器都没问题,唯独iPhone上的不会触发事件 ...
- jquery取消事件冒泡的三种方法(推荐)
1.通过返回false来取消默认的行为并阻止事件起泡. jQuery 代码: ? 1 2 3 4 5 6 7 8 9 10 11 $("form").bind( "s ...
- js 事件冒泡是什么如何用jquery阻止事件冒泡
什么是事件起泡:一个事件不能凭空产生,这就是事件的发生等等,接下来为大家介绍下jquery阻止事件起泡以及关于js事件起泡的验证,感兴趣的朋友可以参考下哈 (1)什么是事件起泡 首先你要明 ...
- 事件冒泡是什么如何用jquery阻止事件冒泡
(1)什么是事件起泡 首先你要明白一点,当一个事件发生的时候,该事件总是有一个事件源,即引发这个事件的对象,一个事件不能凭空产生,这就是事件的发生. 当事件发生后,这个事件就要开始传播.为什么要传播呢 ...
- JS中的事件冒泡(Bubble)和事件捕获(capture)以及如何阻止事件的冒泡
对“捕获”和“冒泡”这两个概念,通常我们对冒泡了解和使用的会更多一些,因为在我们使用的所有浏览器中,都支持事件冒泡 ,即事件由子元素向祖先元素传播的,就 像气泡从水底向水面上浮一样.而在像firefo ...
- Event(事件)的传播与冒泡
特性说明和原理图: 标准浏览器和Ie9+浏览器都支持事件的冒泡和捕获,而IE8-浏览器只支持冒泡 标准和Ie9+浏览器用stopPropagation()或cancelBubble阻止事件传播,而ie ...
- html如何点击子元素事件而不触发父元素的点击事件——阻止冒泡
如果子元素和父元素都有点击事件,会出现点击事件冒泡的情况. 1.如何避免冒泡: html: <html> <head></head> <body> &l ...
随机推荐
- 一文讲述G6实现流程图绘制的常用方法
摘要:G6 是一个图可视化引擎.它提供了图的绘制.布局.分析.交互.动画等图可视化的基础能力. 本文分享自华为云社区<会用这些的api,轻松绘制流程图--antv.g6流程图入门>,作者: ...
- 火出边际的Serverless,你居然还不了解?
摘要:图灵奖获得者David A. Patterson和Spark共同创始人Ion Stoica,在19年伯克利的会议上发布Serverless将是下一代默认的计算范式. 本文分享自华为云社区< ...
- 乐高式扩展:在Seal软件供应链防火墙中轻松集成代码规范工具
上个月,Seal 软件供应链防火墙 v0.2(以下简称"Seal")正式发布,这一版本实现了可扩展架构,用户可以根据自身需求插件式集成原生或第三方解决方案,灵活扩展扫描能力. 在前 ...
- 用火山引擎DataTester,这家企业开始了“数据驱动增长”
年末购物季已至,近些年来,预售抵扣.平台满减.品类专享券.大额补贴--动辄四五种计算方法叠加的大促活动,让不少消费者"懵"感十足.同一样商品,到底谁家卖的最便宜?比价平台应声发展而 ...
- 使用 Kubeadm 部署 Kubernetes(K8S) 安装 -- 持久化存储(PV&PVC)
使用 Kubeadm 部署 Kubernetes(K8S) 安装 -- Ingress-Ngnix 使用 Kubeadm 部署 Kubernetes(K8S) 安装 -- 持久化存储(NFS网络存储) ...
- 收到邮件了,微软新必应(New Bing)可以用了,只隔了一天
收到邮件了,微软新必应(New Bing)可以用了,只隔了一天 国内申请微软新必应(New Bing) 1号我写了一篇文章,介绍内置ChatGPT的微软新必应(New Bing)申请方法,没想到昨天就 ...
- Ali266首次商用落地,助力优酷码率最高节省40%
阿里云自研编码器Ali266于2022年1月在优酷正式上线,这是已知的业界首个H.266/VVC标准的编码器商用落地项目.经过两个月的实际运行数据显示,开启Ali266后,同等画面清晰度的情况下比原H ...
- 微信公众号短链实时阅读量、点赞数爬虫(不会Hook可用)
众所周知,微信分享的公众号分享出的一般都是短链,在这个锻炼下使用浏览器打开并不能获取微信公众的阅读量点赞数等这些信息,如图1所示. 但是实际拥有详细信息的则是这个链接下面,提取链接所需要提交的信息包括 ...
- [Docker] Mac M2 – no such file or directory: /var/lib/docker/volumes ,找不到var/lib/docker/volumes (已解決)
Mac M2 Pro Docker 24.0.6 $ docker volume inspect 14dfdb65fb7075d91b2004c979a3591df54bcc1303ff3ca96a3 ...
- 使用 Serverless Devs 插件快速部署前端应用
作者| 邓超 Serverless Devs 开源贡献者 背景 我们在 上文 [Aliyun] [FC] 如何使用 @serverless-devs/s 部署静态网站到函数计算 中,详细的介绍了如何通 ...