本教程操作环境:windows10系统、react18.0.0版、dell g3电脑。
react怎么取消冒泡?
react 中取消冒泡
最近在做一个 卸载 react组件的小demo碰见了一个小问题 就是冒泡事件的处理
我们在react中卸载组件 可以用重新渲染的方式 卸载
reactdom.render(<app />,document.getelementbyid('root'))// 给dom 元素绑定一个单击事件 重新渲染组件 就会把之前的 app组件 卸载了document.onclick=function(){ reactdom.render(<div>hello react.js</div>,document.getelementbyid('root'))}// 这样虽然实现了 但是出现了新的问题 因为给document 绑定的单击事件 导致 冒泡事件发生了// 然后就开始尝试各中 取消冒泡的方式 在组件中e.stoppropagation()e.cancelbuble=true;// 上面我知道的俩种方式都不可以 后来去网上搜索了一下 终于找到 藏得很深的取消冒泡的方法 function change(e){ // 注意 在 react的事件对象中 是由react组件 给封装了一下 e.nativeevent.stopimmediatepropagation(); // 这个方法就可以做到了 nativeevent 原生方法}
推荐学习:《react视频教程》
以上就是react怎么取消冒泡的详细内容。
