在排序网格中获取上一行/下一行节点答案

【问题标题】：Getting previous/next row node in a sorted grid在排序网格中获取上一行/下一行节点
【发布时间】：2021-10-28 04:45:42
【问题描述】：

我有一个默认按列排序的网格，我在通过添加或减去当前选定的行 ID 来获取下一行/上一行时遇到问题。

这是默认排序的列

{
  headerName: "Created",
  field: "createdOn",
  cellRenderer: (params) => {
    return WebModule.Utils.dateFormat(params.value);
  },
  sort: "desc",
  width: 125
},

这是我获取上一行/下一行的逻辑

class ResultModal {

    constructor(params) {
        this.params = params
        let rowIndex = params.rowIndex;
        this.previousRow = params.api.getRowNode(rowIndex - 1);
        this.nextRow = params.api.getRowNode(rowIndex + 1);
        this.result = params.data;
    }
}

我将整个 ag-grid 参数对象传递给一个模态，以便我可以从模态中的按钮导航网格记录。

问题是，如果我在选择第二行的情况下运行上述逻辑，params.rowIndex 为 1，我会得到带有 (1+1) 的 nextRow，但实际的 rowIndex 的 nextRow 将类似于2245（我在网格中有很多数据）。

所以我最终选择了隐藏在网格深处的一行，而不是实际显示的第三行。

在对网格进行排序/过滤时，我是否需要使用 getRowNode 以外的其他内容？

【问题讨论】：

我希望 ag-grid 可以让您在过滤数据时区分可见行和不可见行（让您跳过隐藏行）——但如果没有，您可以使用 Map 或Array 手动跟踪可见行的 id，然后查看 Array 中的下一项以获取下一个可见行的 id？

标签： javascript ag-grid

【解决方案1】：

我最终使用了api.getDisplayedRowAtIndex()

let node = params.api.getSelectedNodes()[0];
let rowIndex = node.rowIndex;
this.previousRow = params.api.getDisplayedRowAtIndex(rowIndex - 1);
this.nextRow = params.api.getDisplayedRowAtIndex(rowIndex + 1);

无论排序/过滤选项如何，这都会真正获取上一行和下一行。

【讨论】：

【解决方案2】：

一种可能的解决方案是使用

gridOptions.api.forEachNodeAfterFilterAndSort

在显示行时对其进行迭代。请注意，回调传递 RowNode 本身和网格中的行索引。

function forEachNodeAfterFilterAndSort(
    callback: (rowNode: RowNode, index: number) => void
): void;

https://www.ag-grid.com/javascript-data-grid/grid-api/#reference-rowNodes

【讨论】：