react-virtualized icon indicating copy to clipboard operation
react-virtualized copied to clipboard

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

Open yelnyafacee opened this issue 3 years ago • 1 comments

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>

    );



}

yelnyafacee avatar Aug 22 '22 09:08 yelnyafacee

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

MrStLouis avatar Feb 02 '23 00:02 MrStLouis