方法:1、利用“e.stopPropagation()”在没有涉及到原生事件注册只有react事件时使用;2、利用“e.nativeEvent.stopImmediatePropagation()”阻止最外层document上的事件冒泡。

本教程操作环境:Windows10系统、react17.0.1版、Dell G3电脑。
在react中,阻止事件冒泡有两种形式:
1、e.stopPropagation() 在没有涉及到原生事件注册只有react事件时使用。
2、e.nativeEvent.stopImmediatePropagation() 用document.addEventListener注册了原生的事件后使用。
React阻止冒泡事件的方法,主要分为如下两种情况:
1、阻止合成事件间的冒泡,方法:e.stopPropagation();
事件绑定如下:

阻止事件冒泡的写法如下:

2、阻止合成事件与最外层document上的事件间的冒泡,方法:e.nativeEvent.stopImmediatePropagation();
事件绑定写法:
(1)不传参数:

(2)传参数:

阻止事件冒泡的写法:

这样写的原因,是给document添加了点击事件,如下图:

推荐学习:《react视频教程》
以上就是react阻止事件冒泡的方法是什么的详细内容,更多请关注php中文网其它相关文章!
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号