title: ReactJS this props is not a function
body: <p>I know this question is asked a lot because I have done the first two pages of Google and I have searched about it on SO but I didn't found solution for me and I have no idea why i got this error.</p>
  
  <p>So here is my parent component</p>
  
  <pre><code>class App extends Component {
      state = { lang: language }
  
      constructor(props) {
          super(props)
          this.handleLanguage = this.handleLanguage.bind(this)
        }
  
        handleLanguage(langValue){
          this.setState({lang: langValue});
      }
  
      render() {
          return (
              &lt;IntlProvider locale={this.lang} messages={messages}&gt;
                  &lt;div className="App"&gt;
                      &lt;div className="App-content"&gt;
                          &lt;React.Fragment&gt;
                              &lt;div className="menu"&gt;
                                  &lt;Navbar handleLanguage={this.handleLanguage}&gt;&lt;/Navbar&gt;
                              &lt;/div&gt;
                              &lt;Main /&gt;
                          &lt;/React.Fragment&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/IntlProvider&gt;
  
          );
      }
  }
  
  export default (App);
  </code></pre>
  
  <p>and here is my children component</p>
  
  <pre><code>export class Navbar extends React.Component {
      constructor() {
          super();
          this.langChange = this.langChange.bind(this)
      }
  
      langChange(value){
          var lang = value;
          this.props.handleLanguage(lang);            
      }
  
  
      render() {
          return (
              &lt;nav className="navbar navbar-expand-lg nav-bar-bg"&gt;
                  &lt;a href="/"&gt;
                      &lt;img src={Logo_horizontal_flat} className="logo-horizontal-flat"&gt;&lt;/img&gt;
                  &lt;/a&gt;
                  &lt;div className="collapse navbar-collapse" id="navbarSupportedContent"&gt;
                      &lt;div className="navbar-nav"&gt;
                          &lt;a className="nav-item nav-link" onClick={() =&gt; this.langChange("fr")}&gt;&lt;img className="flag" src={flag_fr}&gt;&lt;/img&gt;&lt;/a&gt;
                          &lt;a className="nav-item nav-link" onClick={() =&gt; this.langChange("en")}&gt;&lt;img className="flag" src={flag_us}&gt;&lt;/img&gt;&lt;/a&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/nav&gt;
          )
      }
  }
  </code></pre>
  
  <p>I got this error </p>
  
  <blockquote>
    <p>×
    TypeError: this.props.handleLanguage is not a function</p>
  </blockquote>
  
  <p>I'm trying to pass a data to a parent from his child with following this issue:
  <a href="https://stackoverflow.com/questions/38394015/how-to-pass-data-from-child-component-to-its-parent-in-reactjs">How to pass data from child component to its parent in ReactJS?</a></p>
  
  <p>But I have no idea why I still got this error, I even try to Type my props with PropTypes like this</p>
  
  <pre><code>Navbar.propTypes = {
      handleLanguage: PropTypes.func
  };
  </code></pre>
  
  <p>but it didn't change anything ...</p>
  
  <p><strong>EDIT</strong></p>
  
  <p>Actually it's working when I remove my <code>Main</code> components which is a component with my routes</p>
  
  <pre><code>export class Main extends React.Component {
  
      render (){
          return (
              &lt;Switch&gt;
                  &lt;Route exact path="/" component={Home}&gt;&lt;/Route&gt;
                  &lt;Route path='/signup' component={RegisterPart2} &gt;&lt;/Route&gt;
                  &lt;Route path='/signup1' component={RegisterPart1} &gt;&lt;/Route&gt;
                  &lt;Route path='/signup2' component={RegisterPart3} &gt;&lt;/Route&gt;
                  &lt;Route path='/login' component={Login} &gt;&lt;/Route&gt;
                  &lt;Route path='/profile' component={Profile} &gt;&lt;/Route&gt;
                  &lt;Route path='/information' component={Information} &gt;&lt;/Route&gt;                
                  &lt;Route path='/account' component={Account} &gt;&lt;/Route&gt; 
                  &lt;Route path='/address' component={Adresses} &gt;&lt;/Route&gt;                
                  &lt;Route path='/addadress' component={Addadresses} &gt;&lt;/Route&gt;                
                  &lt;Route path='/countries' component={Countries} &gt;&lt;/Route&gt;                
              &lt;/Switch&gt;
          );
      }
  }
  </code></pre>
  
  <p>I have no idea how this component can affected it, any idea ?</p>
  
  <p><strong>EDIT 2</strong></p>
  
  <p>Finally I got the answer, it's because in my Home component I called the Navbar component again.</p>
  
  <p>Thanks for your help everyone</p>
  
  <p>Thank in advance for your help</p>