华为快应用 阻止事件冒泡

最新推荐文章于 2024-04-28 20:46:32 发布
最新推荐文章于 2024-04-28 20:46:32 发布
阅读量434 收藏 1
点赞数 1
分类专栏： 华为快应用 文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zk_csdn917/article/details/118974392
版权
博主分享了在开发华为快应用时遇到的事件冒泡问题，通过官方文档和实践，找到了解决方案。文中提到使用`evt.stop()`方法阻止事件冒泡导致报错，但通过深入研究，发现了一个原生方法成功解决了问题。提醒开发者要深入理解并尝试不同的解决途径。
摘要由CSDN通过智能技术生成

  1. 直接百度
    现在百度出来有关华为快应用的信息太少了，我这里搜到了一篇有用的，能解决。
    全网最细致的快应用问题解决之道
    全网最细致的快应用问题解决之道
    虽然这个是快应用联盟的，但是华为快应用也有效。
    就是使用了一个变量来控制最外层事件是否执行操作。
    但是后来在写的过程中，我的组件有点多，又组件里放组件，这个逻辑越写越糊涂，最终还是pass掉这个方法了。

  2. 官方文档
    在官方文档中搜索阻止冒泡找到了这条
    华为快应用
    快应用-script脚本
    在这里插入图片描述
    就是说evt.stop()这句写在点击子组件的事件操作的最后面。
    发现确实有效，但是报错了
    报错了
    我就有点疑惑，官方这么写的，怎么会报错？但是我觉得肯定是有阻止冒泡的方法的，然后我灵机一动，打印一下这个evt
    console
    发现了这个方法，抱着试试的心态，果然有效。
    其实答案在这里
    w3school
    一个原生方法
    还是要在努力努力啊

一瓶小可乐_zk
关注
专栏目录
【愚公系列】2023年10月 WPF+上位机+工业互联 047-路由事件
时光隧道
09-25 4万+
网页中的按钮事件是可以冒泡的，这意味着当一个按钮被点击时，它的点击事件会一直向上传递到它的父元素，直到传递到文档根节点。这种事件传递方式被称为事件冒泡。事件冒泡问题的由来是因为HTML的文档结构是一个层次嵌套的树形结构，当一个事件发生时，它将从最深的元素开始传递，一直到最外层元素。这种传递方式可能会导致事件被多次触发，从而引发一些逻辑错误。例如，如果一个按钮被包含在一个链接元素中，当点击按钮时，链接元素和按钮的点击事件都将被触发，这可能会导致不希望的页面行为。为了解决这个问题，开发人员可以使用事件对象的 s
腾讯、华为2024前端技术岗发布+最新内部面试题
最新发布
2401_84433769的博客
05-04 928
盒模型，box-sizingCSS3新特性，伪类，伪元素，锚伪类CSS实现隐藏页面的方式如何实现水平居中和垂直居中。说说position，display请解释*{box-sizing:border-box;}的作用，并说明使用它的好处浮动元素引起的问题和解决办法？绝对定位和相对定位，元素浮动后的display值link和@import引入css的区别解释一下css3的flexbox，以及适用场景inline和inline-block的区别哪些是块级元素那些是行级元素，各有什么特点。
【快应用】小程序转快应用如何阻止事件向上冒泡
华为开发者联盟
11-17 341
小程序转快应用，在快应用中使用view标签包裹两层，在每层都写了一个点击事件，在点击最里面的一个button按钮的时候会触发所有view标签上绑定的点击事件，该如何处理才能只触发一个button按钮的事件呢？bind 事件绑定不会阻止冒泡事件向上冒泡，所以在点击最里面的一个层级后，会触发所有的事件，要想只触发对应的事件可以使用catch事件绑定来阻止向上冒泡。欲了解更多更全技术文章，欢迎访问。
event事件对象(应用案例，比如阻止冒泡)
程宇寒
12-10 510
event事件对象(应用案例，比如阻止冒泡) <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>演示event事件对象(应用案例，比如阻止冒泡)-雪豹软件工作室</title> <link rel="stylesheet&qu
HarmonyOS NEXT应用开发案例——阻塞事件冒泡
maniuT的博客
03-07 876
本示例主要介绍在点击事件中，子组件enabled属性设置为false的时候，如何解决点击子组件模块区域会触发父组件的点击事件问题；以及触摸事件中当子组件触发触摸事件的时候，父组件如果设置触摸事件的话，如何解决父组件也会被触发的问题。
快应用开发中的一些注意事项和坑
青蛙背蝎子过河的博客
07-07 1029
最近公司在开发一款快应用, 第三版已经上线. 期间也踩了不少坑. 特地发出来 , 希望能帮助一些新手同学; 今天简单聊一下, 以后再逐条详细说下 需要说明的是 这些注意的点都是在1040的版本中的问题 目前快应用已升级1050版本 因要考虑大多机型的兼容性 我司还未升级 所以以下仅限于1040版本中的问题 另外 联盟的编辑器和华为的编辑器报错的机...
快应用的开发注意点
weixin_34306593的博客
12-04 432
随着公司越来越多业务线开发快应用，我们总结一下我们这个月开发快应用的心得及给出必要的指导。因为快应用与我们公司的预装策略有关，我们想要手机商预装我们的去哪儿App，那么我们就得帮他们推广一下他们的快应用。至于快应用是否能比微信小程序带来更多流量，那是另一回事了。 快应用目前是由小米公司统一给九大手机商提供技术支持的，因此我们在开发快应用有...
js实现滑动触屏事件监听的方法
10-24
在 `touchend` 事件的处理中，`event.stopPropagation()` 被用来阻止事件继续传播，防止事件冒泡到父元素。 为了确保代码的兼容性，可以使用 jQuery 的 `.offset()` 方法来获取元素的位置，尽管在现代的JavaScript...
OpenHarmony实战开发-使用通用事件、键鼠事件
2401_82546228的博客
04-28 841
键鼠事件指键盘，鼠标外接设备的输入事件。
【快应用】销毁自定义组件，避免组件事件被多次触发
华为开发者联盟
09-13 502
自定义组件的上层组件上有if的话，值变成false，自定义组件都没有被销毁, 导致自定义组件里的事件都可以被触发。销毁自定义组件时，if不要写在自定义组件的父节点上，写在自定义组件上。销毁自定义组件时，会多次触发自定义组件的事件。欲了解更多更全技术文章，欢迎访问。
快速了解4种阻止事件冒泡的方法（原生js阻止，vue中使用修饰符阻止）
m0_48895748的博客
12-07 9455
快速理解阻止事件冒泡的4种方法，使用原生js或者vue中阻止事件冒泡
【快应用】H5快应用Web组件打开的网页出现跨域问题如何解决？
华为开发者联盟
08-10 898
H5快应用Web组件打开的网页出现跨域问题如何解决？
全网最细致的快应用问题解决之道
快应用官方博客
06-26 4956
主要内容 以下为本人在开发工程中遇到的问题和解决的方法，包括： 1、快应用常见问题 2、CSS的box-shadow暂行替代方法 3、CSS触摸反馈的实现与注意 4、CSS动画遇到的问题 5、CSS隐藏组件的动画实现 6、顶部栏titleBar的配置 7、input组件的防止输入时标题被顶飞 8、input的自动获取焦点例子 9、间接阻止冒泡事件 10、快应用编译出问题的解决...
快应用---事件监听与触发
diliedou4174的博客
07-18 1010
一、快应用 1、快应用是基于手机硬件平台的新型应用形态，标准是由主流手机厂商组成的快应用联盟联合制定； 2、快应用标准的诞生将在研发接口、能力接入、开发者服务等层面建设标准平台，以平台化的生态模式对个人开发者和企业开发者全品类开放； 3、快应用具备传统APP完整的应用体验，无需安装，即点即用； ...
事件冒泡的阻止和应用场景
u010513603的博客
12-19 3917
事件冒泡的原理 事件捕获其实有三种方式，事件冒泡只是其中的一种：（1）IE从里到外（inside→outside）的冒泡型事件。（2）Netscape4.0从外到里（outside→inside）的捕获型事件。（3）DOM事件流，先从外到里，再从里到外回到原点（outside→inside→outside）的事件捕获方法（似乎对象将触发两次事件处理，这有什么作用？鄙人不懂！）。 ●
(O)阻止默认事件和阻止冒泡的应用场景
weixin_30530339的博客
03-31 270
场景1：阻止默认事件 比如这样的一个需求 点击取消a标签按钮的时候会触发一些js动作，但是不能让这个a标签产生跳转行为， 所以需要在点击取消的时候 阻止冒泡，防止其跳转。 <a id='cancelBtn' href="https://www.baidu.com">取消按钮</a> <script> document.getElement...
vue中阻止click事件冒泡，防止触发另一个事件
热门推荐
Iloveyougirls的博客
08-30 4万+
使用vue阻止子级元素的click事件冒泡，很简单，用stop 按钮1 按钮2 这样点击div里面的按钮1，就不会触发div绑定时间test1()方法
快应用的用法和常见问题解答（下）
快应用官方博客
05-17 5394
本期作者：执着的烙印 上篇作者为大家讲了什么是快应用以及快应用的开发流程，这期作者分享了快应用开发中遇到的问题和解决办法，一起来看看吧！ 说起快应用，不得不说快应用踩过的坑。 快应用还处于不断优化阶段，在开发过程中，也会遇到一些不完善的地方，由于我们对于新技术的掌握还不透彻，也会使得开发中遇到很多的困难。 我将在快应用开发中遇到的问题罗列到下面，希望对大家的开发有所帮助。 ...
华为快应用引擎架构详解：即点即用的新型应用开发
华为快应用引擎技术架构详解深入剖析了华为推出的新型应用形式——快应用，它在2018年由华为与包括小米、OPPO、VIVO在内的九家手机厂商共同制定联盟标准。快应用的核心特点是无需安装，即点即用，提供接近原生应用的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值