需要樹商店

Question

ExtJS4

我創建了一個TreePanel中的副本

var tree = Ext.create('Ext.tree.TreePanel', <some config>); 
tree.store.setRootNode(treeJSON); 

現在我想創建一個相同的存儲數據，但不同的存儲對象另一棵樹。如果我這樣做：

var tree1 = tree.cloneConfig(<separate listeners>); 

然後，它創建一個不同的樹。但是兩者都有聯繫。當我摺疊或展開一個樹節點時，另一個樹中的對應節點也具有相似的行爲。

存儲沒有cloneConfig屬性，所以我可以複製它。我試圖從這個樹的JSON重新創建商店。

var store2 = Ext.create('Ext.data.TreeStore', {store: treeJSON}); 
var tree1 = tree.cloneConfig({store: store2}); 

我想store2會從tree 4S店不同。但是由於我使用了相同的treeJSON，問題就在那裏。

我可以做的一件事是將JSON轉換爲字符串，將其解碼以創建另一個JSON對象並將其分配給新的商店。這與以前的商店不同。但是，必須有一個快速的方法。

如何創建具有不同存儲對象重複樹，這樣當我展開/摺疊一個節點在一棵樹，它不展開/摺疊以同樣的方式在另外一個？

Answer 1

我已經做了類似的事情。

解析您的老樹，以創建新樹

var root = existingTree.getRootNode(); 
if (root) { 
    var rootNode = this.getClonedTreeRoot(root); 
    newTree.store.setRootNode (rootNode); 
} 


getClonedTreeRoot: function (node) { 

    var me = this; 
    var rootData; 
    var childData = []; 

    if (node.hasChildNodes()) { 
    var childNodes = node.childNodes; 
    Ext.Array.each (childNodes, function (child) { 
     if (child.get ('checked')) { 
    childData.push (me.getClonedTreeRoot(child));   
     }   
    }); 
    } 

    if (node.isLeaf()) { 
    rootData = { 
     "text" : node.get ('text'), 
     "leaf" : true, 
     "expanded" : false, 
     "children" : childData 
    }; 
    } else { 
    rootData = { 
     "text" : node.get ('text'), 
     "leaf" : false, 
     "expanded" : true, 
     "children" : childData 
    }; 
    } 

    return rootData; 
} 

Answer 2

Ext.data.NodeInterface有方法「複製」與參數「深」，但ExtJS的4.1.3深克隆不起作用了。更詳細的：他們只是在調用childNode.clone時忘記傳遞「id」參數。

對於人們仍然使用ExtJS的< 4.1.3使用它進行的樹木深克隆：如果我們有一些內置的功能

/** 
* Because of a bug in Ext.data.NoteInterface in ExtJs < 4.1.3 
* we have to do deep cloning. 
*/ 
var clone = function(node) { 
    var result = node.copy(), 
     len = node.childNodes ? node.childNodes.length : 0, 
     i; 
    // Move child nodes across to the copy if required 
    for (i = 0; i < len; i++) 
    result.appendChild(clone(node.childNodes[i])); 
    return result; 
}; 

var oldRoot = store1.getRootNode(), 
    newRoot = clone(oldRoot); 

store2.setRootNode(newRoot);