React中阻止事件冒泡的问题详析-创新互联
前言
从策划到设计制作,每一步都追求做到细腻,制作可持续发展的企业网站。为客户提供网站制作、成都网站建设、网站策划、网页设计、域名与空间、虚拟主机、网络营销、VI设计、 网站改版、漏洞修补等服务。为客户提供更好的一站式互联网解决方案,以客户的口碑塑造优易品牌,携手广大客户,共同发展进步。最近在研究react、redux等,网上找了很久都没有完整的答案,索性自己整理下,这篇文章就来给大家介绍了关于React阻止事件冒泡的相关内容,下面话不多说了,来一起看看详细的介绍吧
在正式开始前,先来看看 JS 中事件的触发与事件处理器的执行。
JS 中事件的监听与处理
事件捕获与冒泡
DOM 事件会先后经历 捕获 与 冒泡 两个阶段。捕获即事件沿着 DOM 树由上往下传递,到达触发事件的元素后,开始由下往上冒泡。
IE9 及之前的版本只支持冒泡
| A
-----------------|--|-----------------
| Parent | | |
| -------------|--|----------- |
| |Children V | | |
| ---------------------------- |
| |
--------------------------------------
事件处理器
默认情况下,事件处理器是在事件的冒泡阶段执行,无论是直接设置元素的 onclick 属性还是通过 EventTarget.addEventListener()
来绑定,后者在没有设置 useCapture 参数为 true 的情况下。
考察下面的示例:
另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。
文章标题:React中阻止事件冒泡的问题详析-创新互联
本文路径:http://ybzwz.com/article/djhhdg.html