滚动到 ExtJS 网格中的选择答案

【问题标题】：Scroll to selection in an ExtJS Grid滚动到 ExtJS 网格中的选择
【发布时间】：2016-11-10 05:59:23
【问题描述】：

嘿，我需要能够将我的 ExtJS 网格滚动到当前选择，但不知道该怎么做。我在论坛中看到了一个 ensureVisible 方法的参考，但找不到任何信息。任何人都可以提出任何建议吗？谢谢

【问题讨论】：

【解决方案1】：

这似乎也有效：

grid.getView().focusRow(rowIdx);

【讨论】：

【解决方案2】：

不幸的是，从 ExtJS 4 中删除了 ensureVisible()。我发现最直接的解决方案是使用 scrollIntoView()。就我而言，这是在根据我加载的值选择行之后。

var rowIndex = store.find('fieldName', value);
grid.getSelectionModel().select(rowIndex);
Ext.fly(grid.getView().getNode(rowIndex)).scrollIntoView();

这将在网格底部显示选定的行。需要做更多的工作才能将其置于网格的顶部或中间。

【讨论】：

你应该使用 fly 元素来进行这样的操作Ext.fly(grid.getView().getNode(rowIndex)).scrollIntoView();
嘿CTarczon，你能告诉我如何聚焦并将其移动到网格顶部吗？
不知道为什么，但 .scrollIntoView() 在 Ext 4.2 中对我不起作用。幸运的是，返回节点上的一个简单 .focus() 就可以了；）

【解决方案3】：

这似乎也有效：

    grid.getView().getRow(rowIdx).scrollIntoView();

【讨论】：

【解决方案4】：

在 ExtJS 6 上为我工作，即使打开了 bufferedRenderer。

        var record = grid.getSelectionModel().selected.getRange()[0];
        grid.getView().focusRow(record);

【讨论】：

【解决方案5】：

对不起，我真的很笨。我刚刚尝试了 ensureVisible，它工作正常。

【讨论】：

【解决方案6】：

这似乎也有效

grid.getView().getNode(rowIndex).scrollIntoViewIfNeeded();

ExtJs 4.X 的情况下不需要使用Ext.fly

【讨论】：

'evil IE'，scrollIntoViewIfNeeded() 在 chrome 中工作，请参考@bhuvaneswari 对 IE 的回答，如果您使用模态窗口，'scrollIntoView()' 也会出现奇怪的行为

【解决方案7】：

为了省去很多麻烦，您应该知道，如果打开了网格 bufferedRenderer，此线程中用于滚动到视图中的解决方案将不起作用。

据我了解，在 Ext JS 5 中，bufferedRenderer 是默认开启的。

我花了几个小时才意识到这一点。

如果索引行在缓冲行之外，grid.getView().getNode(rowIndex) 将返回 NULL。

【讨论】：

【解决方案8】：

至少在 4.2 中，如果您超出了 bufferedRenderer 中的缓冲范围，则使用 scrollIntoViewIfNeeded 会失败。不过，bufferedRenderer 有一个方便的 scrollTo 方法来帮助完成这项任务：

grid.getView().bufferedRenderer.scrollTo(index, true);

滚动到总数据集中的指定行索引并可选择选择。

【讨论】：