ReactJS-mouseOut 자식 요소의 마우스 오버시 발사?

Question

moueOver 및 mouseOut 함수로 div가 있습니다. 왜 어린이 한 명에 마우스를 올리면 mouseOut이 (가) 발사됩니까? 이것은 목록에 있으므로 '.thumb-overlay'를 하드 코딩하는 대신 e.target을 사용해야합니다. 그것은 또한 h2와 h4 내부의 배경을 조정하고 있으며, 나는 꽤 이해하지 못합니다. 여기에 FIDDLE입니다.

<div className="thumb-overlay" 
onMouseOver={this.mouseOver.bind(this)} 
onMouseOut={this.mouseOut.bind(this)}> 
<h2>SOME H2 TAG</h2> 
<h4>SOME H4 TAG</h4> 
</div> 

Answer 1

대신 e.target의 e.currentTarget 사용할 수 있습니다. e.currentTarget는 항상 이벤트 처리기로 마우스 내가 생각 작동하는 방법 e.target

mouseOver(e) { 
    $(e.currentTarget).css('background', 'red'); 
} 
mouseOut(e) { 
    $(e.currentTarget).css('background', 'gray'); 
} 

jsfiddle