解决此问题,可以在动态添加新行时手动设置表格的滚动位置,使其滚动到下一页的开头。实现方法可以在添加新行后,调用 gridApi.ensureIndexVisible() 方法来保证新行在视图中可见,然后再调用 gridApi.paginationGoToNextPage() 方法来滚动到下一页的开头。
以下是使用 React 作为示例的代码:
import React, { useState } from "react";
import { AgGridReact } from "ag-grid-react";
import { Button } from "antd";
import "ag-grid-community/dist/styles/ag-grid.css";
import "ag-grid-community/dist/styles/ag-theme-alpine.css";
const Table = () => {
const [gridApi, setGridApi] = useState();
const onGridReady = (params) => {
setGridApi(params.api);
};
const addNewRow = () => {
const newRow = { id: Math.random(), name: "New Item" };
gridApi.applyTransaction({ add: [newRow] });
gridApi.ensureIndexVisible(gridApi.getDisplayedRowCount() - 1);
gridApi.paginationGoToNextPage();
};
return (
相关内容