AG 网格：分页大小选择器未显示

Question

我在 Next JS 中使用 AG Grid，并且遵循此文档： https://www.ag-grid.com/react-data-grid/row-pagination/

一旦 AG 网格的分页处于活动状态，网格应显示分页大小选择器。我确实看到两个例外：当 paginationAutoPageSize 为 true 时，它不会显示页面大小选择器。并且，初始化后无法打开页面大小选择器。

考虑到这一点，我不明白为什么我的 AG 网格没有显示页面大小选择器。

这是我渲染 AG 网格的代码。我尝试过在不存在 paginationPageSizeSelector 的情况下将其设置为 true，并将其设置为数组。这些都不起作用。

我有什么遗漏的吗？此代码之外的内容是否会影响页面大小选择器？我真的很感谢你的帮助！

    const paginationPageSizeSelector = useMemo(() => {
        return [200, 500, 1000];
    }, []);

    return (
        <div className="h-full w-full">
            {(!isDefaultConfig || !isConfigSaved) && !!configControlsPortal && (
                <RefPortal container={configControlsPortal}>
                    {!isConfigSaved && (
                        <Button
                            disabled={configRequestStatus.pending}
                            variant="primary"
                            size="small"
                            onClick={saveTableConfig}
                        >
                            Save Column Format
                        </Button>
                    )}
                    <Button
                        disabled={configRequestStatus.pending}
                        variant="tertiary"
                        size="small"
                        onClick={resetTableConfig}
                    >
                        Restore Default
                    </Button>
                </RefPortal>
            )}
            <AgGridReact<Foo>
                ref={gridRef}
                sideBar={SIDE_BAR}
                animateRows={true}
                rowData={rows}
                gridOptions={GRID_OPTIONS}
                className="ag-theme-foo"
                defaultColDef={DEFAULT_COL_DEF}
                onFilterChanged={onFilterChanged}
                excelStyles={EXCEL_EXPORT_FORMATS}
                rowClass="cursor-pointer"
                columnDefs={autoGeneratedColumnDefs}
                onPaginationChanged={newData}
                suppressScrollOnNewData={true}
                paginationAutoPageSize={false}
                pagination={true}
                paginationPageSize={100}
                paginationPageSizeSelector={paginationPageSizeSelector}
                onRowClicked={e =>
                    router.push(
                        `/shipments/${encodeURIComponent(`${e.data?.fooId}`)}`
                    )
                }
                {...gridProps}
            />

我尝试将 paginationPageSizeSelector 设置为 true，将其设置为数组，然后将其保留。在所有情况下，都会显示分页，但不会显示分页大小选择器。

Answer 1

AG Grid v31 中添加了分页页面大小选择器。

https://blog.ag-grid.com/whats-new-in-ag-grid-31/

AG Grid 现在支持直接通过页面大小选择器更改页面大小，当启用行分页时，页面大小选择器会显示在分页面板中。页面大小和当前页面索引由网格状态保存，并且可以轻松恢复为初始状态的一部分。