Ag-grid-Enterprise 使用按钮展开/折叠所有行？ FF 和 Edge 崩溃非常慢

Question

我创建了一个按钮来展开 ag-grid (Enterprise) 中的所有行，网格中有 150 行。它在 Chrome 中运行良好，但在最新的 FF 和 Edge 中显示警告，称该网页使您的浏览器变慢。 有没有更好的方法来扩展所有行？大约需要 10-15 秒

HTML

 <button (click)="expandAll(expand)">Expand/Collapse</button>

JavaScript

 this.columnDefs = [
           {
                headerName: "",
                field: "",
                cellRenderer: "group",// for rendering cell
                suppressMenu: true,
                suppressSorting: true
            }
           ]
           // This is how I am creating fullrow width
            this.gridOptions = <GridOptions>{
            isFullWidthCell: function (rowNode) {
            var rowIsNestedRow = rowNode.flower;
            return rowIsNestedRow;
            },
            fullWidthCellRendererFramework: AgGridInventorRowComponent,
            doesDataFlower: function (dataItem) {
            return true;
         }
    public expandAll(value:boolean) {
            if(value) {
                this.gridOptions.api.forEachNode((node) =>{
                    node.setExpanded(true);
                });
            } else {
                this.gridOptions.api.forEachNode((node) =>{
                    node.setExpanded(false);
                });
            }
        }

原文由 DirtyMind 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

根据文档：

调用 node.setExpanded() 导致重新绘制网格。如果你要扩展的节点很多，那么最好直接设置 node.expanded=true ，完成后再调用 api.onGroupExpandedOrCollapsed() 得到网格重新绘制一次网格。

所以我修改了我的代码如下：

 this.gridOptions.api.forEachNode(node => {
  node.expanded = true;
});
this.gridOptions.api.onGroupExpandedOrCollapsed();

Group Api 中的 Ag-gridDocumentation 页面

原文由 DirtyMind 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

我假设您正在使用 行分组功能，并且您的意思是有 150 个可以扩展的分组行。

当前，您的代码正在针对每一行数据执行……而不仅仅是那些能够扩展的数据。因此，假设每组中有 50 行左右的数据，则调用 setExpanded 函数 7500 次。您可以通过在调用 setExpanded 之前进行检查，将其限制为仅在分组行上调用 setExpanded ：

 public expandAll(value:boolean) {
    this.gridOptions.api.forEachNode((node) =>{
        if (node.group)
            node.setExpanded(value);
    });
}

在 此示例 中对其进行测试，在 firefox 中，110 行组大约需要 2 秒，511 行组大约需要 5 秒

原文由 Jarod Moser 发布，翻译遵循 CC BY-SA 3.0 许可协议