ztree获取选中节点时不能进入可视区域出现BUG如何解决

要解决该问题，我们需要了解ztree如何设置选中节点和如何使该节点在可视区域内。

设置选中节点

使用ztree获取选中节点，我们可以通过getSelectedNodes()方法来获取选中的节点数组。该方法可以直接返回节点对象数组。如果只需要获取单个选中的节点，可以使用方法getSelectedNodes()[0]。当我们获取到选中的节点后，就可以对其进行一系列的操作，如修改节点名称、设置节点选中状态等。

使节点在可视区域内

要使节点在可视区域内，我们可以使用ztree提供的方法scrollIntoView(node, [animate])。该方法可以将指定的节点滚动到可视区域内，第一个参数为要滚动到可视区域内的节点对象，第二个参数为可选参数，是否需要动画效果。传入true表示需要动画效果，传入false表示不需要。

解决获取选中节点时无法在可视区域内的问题

如果获取到的选中节点不能自动进入可视区域，可以通过编写代码手动让选中节点进入可视区域内，方法如下：

var treeObj = $.fn.zTree.getZTreeObj("tree");
var selectedNode = treeObj.getSelectedNodes()[0];
// 判断选中节点是否在可视区域内
if (!treeObj.isVisible(selectedNode)) {
  // 使选中节点进入可视区域内
  treeObj.scrollIntoView(selectedNode);
}

接下来，我们通过两个等价示例进行说明。

示例1：

var treeObj = $.fn.zTree.getZTreeObj("tree");
var selectedNode = treeObj.getSelectedNodes()[0];
treeObj.selectNode(selectedNode);

对于上述示例，在选中节点之后，我们可以尝试着让选中节点进入可视区域中，代码如下：

if (!treeObj.isVisible(selectedNode)) {
  treeObj.scrollIntoView(selectedNode);
}

示例2：

var treeObj = $.fn.zTree.getZTreeObj("tree");
var selectedNode = treeObj.getSelectedNodes()[0];
treeObj.selectNode(selectedNode);
treeObj.scrollIntoView(selectedNode);

对于上述示例，我们选中节点后直接使用scrollIntoView()方法将节点滚动至可视区域。

通过观察两个示例，我们可以看出在选择节点后及时进行scrollIntoView()方法的调用是能够避免“选中节点不能进入可视区域”的问题的，这也是解决该问题的一种技巧和方法。