title: Set state from another component React js
body: <p>I have the following structure in <em>index.js</em> :</p>
  
  <pre><code>&lt;MyAppBar // + properties/&gt;
   &lt;Route path={path} component={Login}/&gt;
  </code></pre>
  
  <p><em>MyAppBar.js</em></p>
  
  <pre><code> class MyAppBar extends React.Component {
  
  state = {
    auth: false,
    anchorElement: null
  };
  
  handleLogin(){
    this.setState({auth:true});
  }
  
  //another code
  //end component
  
  export default withStyles(styles)(MyAppBar)
  </code></pre>
  
  <p>I want to update <em>MyAppBar</em> state <em>auth</em> flag to be <em>true</em> from within the <em>Login</em> component action handler (i.e. <em>handleLogin</em>), but I do not know how.</p>
  
  <p>I've tried with importing <em>MyAppBar</em> (all component) on the <em>Login</em> page, but it says that </p>
  
  <pre><code>MyAppBar.handleLogin(); 
  </code></pre>
  
  <p>is not a function... Thank you!</p>
  
  <p>Thank you!</p>