react阻止冒泡相关

@ckinmind 2018-10-27 09:25:07发表于 ckinmind/ReactCollect

[问题描述]: 在react中使用stopPropagation但是没有组织冒泡的发生

[问题解决]: react阻止冒泡事件,绝对干货

react中的合成事件和原生事件之间的区别

  1. 合成事件, 在jsx中直接绑定的事件,如
<a ref="aaa" onClick={(e)=>this.handleClick(e)}>更新</a>

这里的handleClick事件就是合成事件

  1. 原生事件, 通过js原生代码绑定的事件,如
document.body.addEventListener('click',e=>{ ...
  1. 阻止冒泡事件分三种情况
    A、阻止合成事件间的冒泡,用e.stopPropagation()
    B、阻止合成事件与最外层document上的事件间的冒泡,用e.nativeEvent.stopImmediatePropagation()
    C、阻止合成事件与除最外层document上的原生事件上的冒泡,通过判断e.target来避免