如何在 ExtJs 中清除一棵树？

Question

我已经成功创建了一个 Ext.tree .TreePanel 动态加载子节点，但我很难清除树并加载新数据。 有人可以帮我编写代码来执行此操作吗？

Answer 1

来自 ExtJS 大师 Saki 的精彩博客。

while (node.firstChild) {
    node.removeChild(node.firstChild);
}

http://blog .extjs.eu/know-how/how-to-remove-all-children-of-a-tree-node/

Answer 2

在Ext JS 4中：

如果要重新加载树面板的数据，则需要重新加载树存储：

getCmp('treeId').getStore().load();

其中treeId是树的id。 如果您有商店 id，则可以直接对商店 id 使用 load() 。

删除所有子节点：

getCmp('treeId').getRootNode().removeAll();

但是，从存储中重新加载树节点时，不需要删除子节点。

Answer 3

就我而言，我的 Ext 树有一个 AsyncTreeNode 类型的隐藏根节点。 如果我想清除树并从服务器重新填充，这非常简单：

tree.getRootNode().reload();

Answer 4

我终于在他们的论坛中找到了答案。 对于任何感兴趣的人来说，它在这里：

if (tree)
{
    var delNode;
    while (delNode = tree.root.childNodes[0])
        tree.root.removeChild(delNode);
}

Answer 5

您可以简单地使用node.removeAll()来删除该节点的所有子节点。

http://docs.sencha. com/extjs/4.2.1/#!/api/Ext.data.NodeInterface-method-removeAll

Answer 6

我遇到了类似的问题，我想出的解决方案是“标记”节点在折叠时尚未加载，从而在重新展开时强制重新加载。

listeners: {
   collapsenode: function(node){
   node.loaded = false;
},

Answer 7

if (树) { var delNode;   while (delNode = tree.root.childNodes[0]) tree.root.removeChild(delNode);   } 
  

我不知道 Ext，但我猜他们有 DOM 抽象，这可能会让这件事变得更容易。 Prototype 中的等效项类似于：

tree.root.immediateDescendants().invoke('remove'); // or
tree.root.select('> *').invoke('remove');

除非 tree.root 引用集合对象而不是树的根 DOM 节点，但是否借用 DOM API 方法名称？ 这似乎不太可能，特别是对于现代 JS 库而言。