title: React : Pass function to child component
body: <p>I try to pass a function to my child component. For each child component when the user click on them, the onclick function will be call. This onclick function is written into the parent component.</p>
  
  <p>Parent component:</p>
  
  <pre><code>class AgentsList extends React.Component {
    constructor(props) {
      super(props);
    }
  
    handleClick(e) {
      e.preventDefault();
      console.log(this.props);
    }
  
    render() {
      const { agents } = this.props;
  
      ...
  
      var agentsNodes = agents.map(function(agent, i) {
        if(agent.id_intervention == "") {
          return (
            &lt;Agent agent={agent} key={i} ticket={t} id={row_names} onClick={this.handleClick.bind(this)} /&gt;
          );
        }
      });
      return (
        &lt;div id="agents"&gt;
          &lt;div className="agents-title"&gt;
            &lt;h3&gt;Title&lt;/h3&gt;
          &lt;/div&gt;
          {agentsNodes}
        &lt;/div&gt;
      );
    }
  }
  </code></pre>
  
  <p>Child component:</p>
  
  <pre><code>class Agent extends React.Component {
    constructor(props) {
      super(props);
    }
  
    render() {
      const { agent, t } = this.props;
  
      return (
        &lt;Link to='/' onClick={this.props.onClick}&gt;
          ...
        &lt;/Link&gt;
      );
    }
  }
  </code></pre>
  
  <p>At this line : <code>&lt;Agent agent={agent} key={i} ticket={t} id={row_names} onClick={this.handleClick.bind(this)} /&gt;</code></p>
  
  <p>It say that handleClick is not defined ...
  How can I sovle this problem ?</p>
  
  <p>Thank's for your answer.</p>