title: Why shouldn't we use ref?
body: <p><a href="https://zhenyong.github.io/react/docs/more-about-refs.html" rel="nofollow noreferrer">In Facebook's documentation on <code>refs</code>:</a></p>
  
  <blockquote>
    <p>Don’t Overuse <code>Refs</code> Your first inclination may be to use refs to “make
    things happen” in your app. If this is the case, take a moment and
    think more critically about where <code>state</code> should be owned in the
    component hierarchy. Often, it becomes clear that the proper place to
    “own” that state is at a higher level in the hierarchy. See the
    <code>Lifting State Up</code> guide for examples of this.</p>
  </blockquote>
  
  <p>In my current React app, I have a few <code>div</code> nodes that I want to modify on condition. Those div nodes were created deep inside the <code>render()</code>'s chained <code>returns</code>. I certainly can't use Document.queryselector(). And I cannot think of anything else. </p>
  
  <p>Documentation also tried to explain with article "lifting state up" but I didn't understand. Can someone shed a light on this one? (<code>ELI5</code> if you could.)</p>