title: React - How do I access a function in another component?
body: <p>My structure is as such:</p>
  
  <pre><code>       &lt;ParentComponent /&gt;
   &lt;Child 1 /&gt;     &lt;Child 2 /&gt;
  </code></pre>
  
  <p>I have a function in <code>&lt;Child 1 /&gt;</code>. Since <code>&lt;Child 1 /&gt;</code> controls the grid-layout, and <code>&lt;Child 2 /&gt;</code> is a Navbar with buttons, I want to have a button in <code>&lt;Child 2 /&gt;</code> which will reset some parameters in <code>&lt;Child 1 /&gt;</code>.</p>
  
  <p>How do I achieve this? As far as I can see, <code>refs</code> will only be able to go one "step" up the tree, not down. </p>
  
  <p>There isn't any obvious way this function can be invoked from the <code>parent</code> component. Is there any way here? All the solutions I can think of aren't really following the React-mindset, namely the unidirectional data-flow. </p>