중첩 된 구성 요소가 redux 동작을 디스패치하는 경우 이벤트 버블 링을 중지하려면 어떻게해야합니까?

Question

나는 중첩 된 구성 요소를 동적으로 렌더링하며, 모두 중첩 동작에 첨부됩니다.

안타깝게도 가장 안쪽의 요소를 클릭하면이 모든 작업이 호출됩니다. 이러한 상황에서 버블 링을 막으려면 어떻게해야합니까?

예제 코드 :

<div onClick={()=>this.props.anAction(elementName)}>{elementName} 
     <div onClick={()=>this.props.anAction(innerElementName)}>{innerElementName} 
     <div onClick={()=>this.props.anAction(innerInnerElementName)}>  
      {innerInnerElementName} 
     </div> 
    </div> 
    </div> 

Answer 1

당신은 내가 내가 돌아 오는와 그 방법으로 사용할 수 몰랐어요 onClickevent 및 trigger stopPropagation()

<div onClick={(e)=>this.props.anAction(innerInnerElementName, e)}>  
    {innerInnerElementName} 
</div> 

anAction(el, ev) { 
    ev.stopPropagation(); 
    ... 
}