AG Grid infinite row model not working - cannot get grid to draw rows when it is in the middle of drawing rows

Viewed 673

When I'm using AG Grid infinite row model, I get the following error: cannot get grid to draw rows when it is in the middle of drawing rows. Your code probably called a grid API method while the grid was in the render stage. To overcome this, put the API call into a timeout, e.g. instead of api.refreshView(), call setTimeout(function() { api.refreshView(); }, 0). The code I'm using for infinite scroll model is following error text recommendation:

const onGridReady = (params: any) => {
        setGridApi(params.api);
        setGridColumnApi(params.columnApi);
        if (state && params.columnApi) {
            params.columnApi.applyColumnState({ state: state as ColumnState[], applyOrder: true });
        }
        if (sortModel && params.api) {
            params.api.setSortModel(sortModel);
        }
        if (filterModel && params.api) {
            params.api.setFilterModel(filterModel);
        }

        const updateData = (data: any) => {
            const dataSource = {
                rowCount: null,
                getRows: function (params: any) {
                    setTimeout(() => {
                        let lastRow = -1;
                        if (data.length <= params.endRow) {
                            lastRow = data.length;
                        }
                        params.successCallback(data, lastRow);
                    }, 500);
                },
            };
            params.api.setDatasource(dataSource);
        }

        fetchSparepart(`${process.env.REACT_APP_API_HOST}/spareparts?startRow=${params.startRow ?? 0}&endRow=${params.endRow ?? 50}`)
            .then(res => updateData(res))
    }

                <AgGridReact
                    localeText={AG_GRID_LOCALE_RU}
                    rowBuffer={0}
                    rowSelection={'multiple'}
                    rowModelType={'infinite'}
                    paginationPageSize={50}
                    cacheOverflowSize={2}
                    maxConcurrentDatasourceRequests={1}
                    infiniteInitialRowCount={50}
                    maxBlocksInCache={10}
                    paginationAutoPageSize={true}
                    pagination={true}
                    onGridReady={onGridReady}
                    onSelectionChanged={onSelectionChanged}
                    onSortChanged={onSortChanged}
                    onFilterChanged={onFilterChanged}
                    rowClassRules={rowClassRules}
                    onRowDoubleClicked={onSelectionChanged}
                    frameworkComponents={{
                        booleanCellRenderer: booleanCellRenderer
                    }}
                    context={{
                        methodFromParent
                    }}
                >
                ....

What I'm missing here?

0 Answers
Related