ReactJS - Call One Component Method From Another Component

Question

I have two components. I want to call a method of the first component from the second component. How can I do it?

Here is my code.

First Component

class Header extends React.Component{      constructor(){         super();     }      checkClick(e, notyId){        alert(notyId);     } }  export default Header; 

Second Component

class PopupOver extends React.Component{      constructor(){         super();         // here i need to call Header class function check click....         // How to call Header.checkClick() from this class     }      render(){         return (             <div className="displayinline col-md-12 ">                 Hello             </div>         );     } }  export default PopupOver; 

Answer 1

You can do something like this

import React from 'react';  class Header extends React.Component {  constructor() {     super(); }  checkClick(e, notyId) {     alert(notyId); }  render() {     return (         <PopupOver func ={this.checkClick } />     ) } };  class PopupOver extends React.Component {  constructor(props) {     super(props);     this.props.func(this, 1234); }  render() {     return (         <div className="displayinline col-md-12 ">             Hello         </div>     ); } }  export default Header; 

Using statics

var MyComponent = React.createClass({  statics: {  customMethod: function(foo) {   return foo === 'bar';   }  },    render: function() {  } });  MyComponent.customMethod('bar');  // true