La razón por la que quiero usar la ventana de reacción es para evitar un problema de DOM excesivo. Además, porque estoy usando nextjs y React.lazy() no funciona allí. Tengo un componente de Layout en el que los niños se generan dinámicamente, puede ver cómo se resuelve el problema aquí . Sin embargo, me parece que no es posible obtener la altura de los niños de antemano.

Además de LayoutWrapper como se muestra en la pregunta anterior, VariableSizeList se configura para mí de la siguiente manera:

 const [heights, setHeights] = React.useState<number[]>([]) React.useEffect(() => { // This will actually returns [] which I don't want to happen. // I want it to return an array of heights const data = onMount() setHeights(data) }, [onMount]) const Row = ({index, style}: ListChildComponentProps) => ( <div style={style}>{childrenArr[index]}</div> ) const getItemSize = (index: number) => heights[index] return ( <AutoSizer disableWidth> {({height, width}) => ( <VariableSizeList height={height} itemCount={childrenArr.length} itemSize={getItemSize} width={width} > {Row} </VariableSizeList> )} </AutoSizer> )

¿Hay alguna solución alternativa a esto?