title: How to get parent width/height in React using Hooks?
body: <p>I'm creating a component and I need to get it's parent <code>&lt;div&gt;</code> width and height. I'm using Hooks, so all my components are functions. I've read some examples using classes, but this won't apply to my component.</p>
  
  <p>So I have this component:</p>
  
  <pre><code>export default function PlantationMap(props) {
      &lt;div className="stage-canvas"&gt;
          &lt;Stage
            width={window.innerWidth * 0.5}
            height={window.innerHeight * 0.5}
            onWheel={handleWheel}
            scaleX={stage.stageScale}
            scaleY={stage.stageScale}
            x={stage.stageX}
            y={stage.stageY}
            draggable
          / &gt;
      &lt;/div&gt;
  }
  </code></pre>
  
  <p>How could I get the <code>&lt;div&gt;</code> height and width to use in <code>&lt;Stage width={} height={} /&gt;</code>?</p>
  
  <p>Thank you very much in advance</p>
  
  <p>Edit: I tried using the <code>useRef()</code> hook, like this:</p>
  
  <pre><code>const div = useRef();
  
  return (
    &lt;div ref={div}&gt;
    ...
    &lt;/div&gt;
  )
  </code></pre>
  
  <p>But I can't access the <code>div.current</code> object</p>