[REACTJS] 구성 요소의 온 클릭 이벤트를 반응

구성 요소의 온 클릭 이벤트를 반응

해결법

1. ---

   1.이것은 당신의 SensorItem 구성 요소의 정의에 따라 달라집니다. SensorItem 당신이 말했듯이 여기에 정의 된 바와 같이, 또 다른, 온 클릭을 구성 요소 반작용, 기본 DOM 요소가 아니라 때문에 단순히 해당 구성 요소의 속성입니다. 당신이해야 할 것은 SensorItem 구성 요소의 내부는 DOM 구성 요소의 onClick 이벤트에 온 클릭 소품을 통과입니다 :

   이것은 당신의 SensorItem 구성 요소의 정의에 따라 달라집니다. SensorItem 당신이 말했듯이 여기에 정의 된 바와 같이, 또 다른, 온 클릭을 구성 요소 반작용, 기본 DOM 요소가 아니라 때문에 단순히 해당 구성 요소의 속성입니다. 당신이해야 할 것은 SensorItem 구성 요소의 내부는 DOM 구성 요소의 onClick 이벤트에 온 클릭 소품을 통과입니다 :

   var SensorItem = React.createClass({
     render: function() {
       return (
         <div className="SensorItem" onClick={this.props.onClick}>
          ...
         </div>
       );
     }
   });
   

2. ---

   2.존재가 다른 답변에서 설명한 문제는,이라고 온 클릭은 요소에 (

   또는 같은 기본 DOM 요소 반대로 ) 성분 속성 선언로 취급 아닌 DOM 이벤트 핸들러이다 . 그리고 아마 당신의 요소는 속성을 onclick을 선언하지 않고 그 값 때문에 단순히 분실.

   존재가 다른 답변에서 설명한 문제는,이라고 온 클릭은 요소에 (

   또는 같은 기본 DOM 요소 반대로 ) 성분 속성 선언로 취급 아닌 DOM 이벤트 핸들러이다 . 그리고 아마 당신의 요소는 속성을 onclick을 선언하지 않고 그 값 때문에 단순히 분실.

   내 경험으로 대부분의 경우이 문제를 해결하는 최적의 솔루션에서 객체 destructuring 표기법을 사용하는 모든 정의되지 않은 구성 요소의 속성, 그 구성 요소 내에서 루트 DOM 요소에 직접 전달할 그룹이다. 이 방법은 당신이 그들 각각에 대해 별도의 속성을 정의 할 필요없이 온 클릭, onHover, 클래스 이름 등을 전달할 수 있습니다.

   function SensorItem({ prop1, prop2, ...rootDOMProps }) {
     (...)
   
     return (
       <p {...rootDOMProps}>
         (...)
       </p>
     );
   }
   

   // Now this handler will work, as it'll be attached to the
   // root DOM element of SensorItem
   <SensorItem onClick={...} />
   

from https://stackoverflow.com/questions/28268835/react-onclick-event-on-component by cc-by-sa and MIT license