reactjs - React.js How can have an onClick function apply to all component divs -


i have handleclick function console.logs initindex state. want work on secondcomponent div too. @ moment, though have handleclick function in secondcomponent not fire event.

ideally don't want repeat handleclick function again in secondcomponent. missing?

i still quite new react , it's baffling me.

var playappcomponent = react.createclass({   getinitialstate : function(){         return {           initindex : true         };       },        handleclick: function() {         console.log("is "+ this.state.initindex)       },         render: function(){         return (           <div>           <h2 classname="visible" onclick={this.handleclick}>true</h2>           <secondcomponent />           </div>         );       }      }); var secondcomponent = react.createclass({   getinitialstate : function(){     return {       initindex : true     };   },    render: function(){     return (       <div>         <h2 classname="visible" onclick={this.handleclick}>true</h2>       </div>     );   }  });  reactdom.render(   <playappcomponent />,   document.getelementbyid('app') ); 

any appreciated. moe

pass handle function attribute second component , call function on onclick handler below

var playappcomponent = react.createclass({   getinitialstate : function(){     return {       initindex : true     };   },    handleclick: function() {     console.log("is "+ this.state.initindex)   },     render: function(){     return (       <div>       <h2 classname="visible" onclick={this.handleclick}>true</h2>       <secondcomponent handleclick={this.handleclick}/>       </div>     )};   }  }); var secondcomponent = react.createclass({    getinitialstate : function(){      return {           initindex : true      };     },    handleclick: function() {      this.props.handleclick();    },      render: function(){      return (         <div>            <h2 classname="visible" onclick={this.handleclick}>true</h2>         </div>      );     }  });  reactdom.render(   <playappcomponent />,   document.getelementbyid('app') ); 

Comments

Popular posts from this blog

sequelize.js - Sequelize group by with association includes id -

android - Robolectric "INTERNET permission is required" -

java - Android raising EPERM (Operation not permitted) when attempting to send UDP packet after network connection -