如何通过API返回值设置ag-grid分页面板的总行数与总页数

核心需求：将分页面板默认展示的本地行数据总计数，替换为API接口返回的自定义总数值（例如示例中的8000）。
以下是兼容官方规范、不会随版本升级失效的实现方式，不推荐直接操作DOM修改类名为ag-xx-row-count的元素——这类带版本号的类名会随ag-Grid版本迭代变化，且grid每次重绘、翻页都会覆盖手动修改的DOM文本。

方案1：服务端分页场景（绝大多数分页需求的首选方案） #

服务端分页模式下每次仅加载当前页数据，天然支持自定义总记录数，配置步骤如下：

• 初始化grid时开启分页、配置服务端行模型

const gridOptions = {
  pagination: true, // 开启分页
  paginationPageSize: 20, // 单页展示条数
  rowModelType: 'serverSide', // 启用服务端行模型
  // 其余业务配置...
}

• 实现服务端数据源，在getRows回调中把接口返回的总条数传给grid

const serverDatasource = {
  getRows: (params) => {
    // 调用自有业务分页接口，传入分页参数
    fetch(`/api/your-list-api?page=${Math.ceil(params.request.endRow / gridOptions.paginationPageSize)}&pageSize=${gridOptions.paginationPageSize}`)
      .then(res => res.json())
      .then(res => {
        params.success({
          rowData: res.currentPageData, // 当前页的列表数据
          rowCount: res.totalCount // 这里传入接口返回的总记录数，例如8000，grid会自动渲染到分页面板
        })
      })
  }
}
// 给grid实例注册数据源
gridOptions.api.setServerSideDatasource(serverDatasource);

方案2：客户端分页场景（全量数据已加载到本地，需强制替换展示总条数） #

如果使用客户端分页模式（所有数据已拉取到前端），可以直接调用官方API修改展示的总条数：

• ag-Grid 28及以上版本直接调用内置API即可

// 接口拿到自定义总条数（例如8000）后执行
gridOptions.api.setPaginationTotalRowCount(8000);
// 刷新分页面板让修改生效
gridOptions.api.refreshPagination();

• 28以下低版本可以通过自定义状态栏组件，完全接管分页面板的渲染逻辑，直接绑定接口返回的总数值即可，不需要依赖grid内部的计数规则。

内容的提问来源于stack exchange，提问作者Nancy