Por favor revise el fragmento a continuación. Los elementos anidados dentro de div cambian y se vuelven a renderizar (administrados por estado) y, en consecuencia, cambia la altura de div . Pero no obtengo la altura/ancho más duradero de la etiqueta div . Da la altura/anchura anterior (una renderización detrás).
¿Alguna idea, cómo obtener el ancho/alto más actualizado de div en cada renderizado?
¡Gracias!
import { useRef, useEffect } from "react"; const Component = (props) => { const willMount = useRef(true); const y = useRef(); // const [width, height] = useWindowSize(); useLayoutEffect(() => { console.log("helloUseLayout"); console.log(y.current.offsetWidth); console.log(y.current.offsetHeight); }); useEffect(() => { if (willMount.current) { //... } willMount.current = false; console.log(y.current.offsetWidth); console.log(y.current.offsetHeight); }); return ( <div ref={y} style={{height: "300px", overflow: "auto" }}> // Other Nested Components... // causing overflow and thus creating Y-Scrollbar. </div> ); }; export default Component;