bvaughn / react-virtualized

React components for efficiently rendering large lists and tabular data
http://bvaughn.github.io/react-virtualized/
MIT License
26.1k stars 3.05k forks source link

Stop AutoSizer from keep updating the width when browser window resized dynamically? #1768

Open yelnyafacee opened 1 year ago

yelnyafacee commented 1 year ago

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>

    );

}
MrStLouis commented 1 year ago

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