在测试小程序的时候，发现了这样的一个bug，点击子元素事件d的时候触发父元素的点击事件，从而执行父级的点击事件，跳转到了父级的点击事件的页面了。
其实很简单，只需要把子级的bindtap改成catchtap，就可以了。
因为：
bind事件绑定不会阻止冒泡事件向上冒泡
catch事件绑定可以阻止冒泡事件向上冒泡
当点击子集的catchtap='navmap'事件之后阻止冒泡事件向上冒泡，所以不会触发bindtap='carState'，成功解决bug,实现小程序中点击子元素事件而不触发父元素的点击事件。
原文作者：祈澈姑娘 技术博客：https://www.jianshu.com/u/05f416aefbe1
90后前端妹子，爱编程，爱运营，爱折腾。
坚持总结工作中遇到的技术问题，坚持记录工作中所思所见，对于博客上面有不会的问题，可以加入qq群聊来问我：473819131.
在测试小程序的时候，发现了这样的一个bug，点击子元素事件d的时候触发父元素的点击事件，从而执行父级的点击事件，跳...
在测试小程序的时候，发现了这样的一个bug，点击子元素事件d的时候触发父元素的点击事件，从而执行父级的点击事件，跳...
测试代码 效果如图 当我们点击子元素(黄色区域)时会先触发子元素的点击事件，然后会继续触发父元素的点击事件，阻止冒...
原理：bind事件绑定不会阻止冒泡事件向上冒泡catch事件绑定可以阻止冒泡事件向上冒泡 当点击子元素的catch...
注：父元素和子元素都有click事件绑定，当点击子元素，希望执行子元素的事件而不执行父元素事件，在子元素事件开始时...
不使用修饰符情况 执行结果：点击了子元素；点击了父元素 stop - 阻止事件冒泡 执行结果：点击了子元素（未触发...
Vue 语法中使用的 注意事项 在DOM中 可能存在 点击触发子元素事件，父元素事件也跟着响应了 （这叫...
嵌套的div元素，如果父级和子元素都绑定了一些事件，那么在点击最内层子元素时可能会触发父级元素的事件，下面介...
事件委托，主要思想是： 给父级元素定义一个事件（比如 onclick 点击事件）。 父级元素触发这个事件后，就会命...
时间冒泡就是说: 当点击子元素的时候, 父元素或者祖先元素如果也绑定了点击事件, 那么父元素或者祖先元素的事件也会...
本文标题：小程序中点击子元素事件而不触发父元素的点击事件
本文链接：https://www.haomeiwen.com/subject/vuoarqtx.html
网友评论