Как очистить дерево в ExtJs?

Question

Мне удалось создать Ext.tree.TreePanel , который загружает дочерние узлы динамически, но мне трудно очистить дерево и загрузить его с новыми данными. Может кто-нибудь помочь мне с кодом, чтобы сделать это?

Answer 1

Из замечательного блога Саки и гуру ExtJS.

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

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

Answer 2

In Ext JS 4:

Если вы хотите перезагрузить данные панели дерева, вам необходимо перезагрузить хранилище дерева:

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

где treeId - это идентификатор дерева. Если у вас есть идентификатор магазина, вы можете напрямую использовать load () для идентификатора магазина.

чтобы удалить все дочерние узлы:

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

Однако удаление дочерних узлов не требуется для перезагрузки узлов дерева из его хранилища.

Answer 3

В моем случае у моего дерева Ext есть скрытый корневой узел типа AsyncTreeNode. Если я хочу очистить дерево и снова заполнить его с сервера, это довольно просто:

tree.getRootNode().reload();

Answer 4

Вы можете просто использовать node.removeAll(), чтобы удалить все дочерние узлы из этого узла.

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

Answer 5

Я наконец нашел ответ на их форумах. Для всех, кто интересуется именно здесь:

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

Answer 6

Я столкнулся с подобной проблемой, и решение, которое я нашел, состояло в том, чтобы «пометить» узел, который не был загружен, когда он был свернут, что вызвало перезагрузку при повторном расширении.

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

Answer 7

if (tree) { 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 дерева, но заимствует ли имена методов API DOM? Это кажется маловероятным, особенно для современной библиотеки JS.