title: React - passing ref to sibling
body: <p>I need to have 2 <strong>sibling</strong> components, and 1 of them has to have a reference to another - is that possible?</p>
  
  <p>I tried this:</p>
  
  <pre><code>&lt;button ref="btn"&gt;ok&lt;/button&gt;
  &lt;PopupComponent triggerButton={this.refs.btn} /&gt;
  </code></pre>
  
  <p>And even this</p>
  
  <pre><code>&lt;button ref="btn"&gt;ok&lt;/button&gt;
  &lt;PopupComponent getTriggerButton={() =&gt; this.refs.btn} /&gt;
  </code></pre>
  
  <p>But I get <code>undefined</code> in both situations. Any ideas?</p>
  
  <p>Note: a parent component will not work for me, because I need to have multiple sets of those, like </p>
  
  <pre><code>&lt;button /&gt;
  &lt;PopupComponent /&gt;
  &lt;button /&gt;
  &lt;PopupComponent /&gt;
  &lt;button /&gt;
  &lt;PopupComponent /&gt;
  </code></pre>
  
  <p>NOT like this:</p>
  
  <pre><code>&lt;div&gt;
    &lt;button /&gt;
    &lt;PopupComponent /&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;button /&gt;
    &lt;PopupComponent /&gt;
  &lt;/div&gt;
  &lt;div&gt;
    &lt;button /&gt;
    &lt;PopupComponent /&gt;
  &lt;/div&gt;
  </code></pre>