title: Targeting/Scrolling to a React Component that is not a close parent/child
body: <p>I have a situation where I want to scroll to a React component from another component that is <strong>not</strong> in a direct or close parent/child relationship.</p>
  
  <p>The structure can be explained as follows:</p>
  
  <pre><code>Component A &gt; a parent &gt; a parent &gt; a parent &gt; a parent &gt; a parent &gt; a parent &gt; a child &gt; a child &gt; Component B
  </code></pre>
  
  <p>As you can see it is not direct at all. If the relationship were direct, or even a grandparent/grandchild, I would usually pass a ref. However in this instance, I would need to pass the ref through 10 or so files in order to have access to it, which seems ridiculous.</p>
  
  <p>I know I can use <code>document.getElementById</code> (or similar) but was wondering if there is a way I can do this via a ref or something similar in React?</p>