我正在使用 AG Grid React。我有一千行数据。我正在尝试根据索引选择一系列行。

    gridOptions.api.forEachNode(node => {
        if (node.childIndex >= startIndex && node.childIndex < endIndex) {
            node.setSelected(true)
        }
    });

事实证明这非常麻烦，在 UI 上通常需要 30 秒。似乎 setSelected 触发了多个渲染周期。正确的做法是什么？

最佳答案

问题是 - setSelected(newValue) 调度事件。当我们在一个循环中为一千个项目(说)执行它时 - 有一千个事件，一千个请求在 React 中排队等待异步更新，这可以解释所有的延迟。

我使用另一个版本的 setSelected - setSelected(newValue, clearSelection, suppressFinishActions) 修复了它。不幸的是，这没有写在官方文档中。 这个想法是将此版本用于除最后一个 选择之外的所有选择，以便抑制所有事件分派(dispatch)并使用我们一直使用的正常选择来选择最后一个元素，以便它也触发必要的onRowSelected、onSelectionChanged 等事件正常工作。

        this.api.forEachNodeAfterFilter(node => {
            if (node.childIndex >= startIndex && node.childIndex < endIndex) {
                selectedNodes.push(node);
            }
        });

        if (selectedNodes.length > 0) {
            // setSelected re-renders every time so use suppressFinishActions except last one
            for (let i = 0; i < selectedNodes.length - 1; i++) {
                selectedNodes[i].setSelected(true, false, true);
            }
            selectedNodes[selectedNodes.length - 1].setSelected(true);
        }

https://stackoverflow.com/questions/54779821/