react-virtualized
react-virtualized copied to clipboard
Stop AutoSizer from keep updating the width when browser window resized dynamically?
How do I stop AutoSizer from keep updating the width when browser window resized dynamically ( dragged by mouse etc )?
I just need the width to calculate once ( on first load ) or when page is refreshed, no more recalculation on screen resize after that
my code:
import {
List,
AutoSizer,
CellMeasurer,
CellMeasurerCache,
} from "react-virtualized";
function Result(props) {
....
return (
<AutoSizer disableHeight>
{({ width }) => {
containerWidth = width;
// Get Justified Layout Geometry
renderJustifiedLayoutGeometry();
return (
<React.Fragment key={ Math.random().toString(36).substr(2, 9) }>
<div className="c-justified-grid" style={{ width: width }}>
<List
width={width}
height={100}
autoHeight={true}
rowHeight={rowHeight}
rowRenderer={renderRow}
rowCount={new_LayoutGeometry.length}
style={{ contain:'layout' }}
overscanRowCount={3}
key={ Math.random().toString(36).substr(2, 9) }
/>
</div>
</React.Fragment>
)
}}
</AutoSizer>
);
}
Just pass the child component the width once. Use a variable, check if its set already, if it is undefined set it. if it isn't undefined dont set it to the new value