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商店不同。但问题出在那里，因为我使用的是同一个treeJSON。

我可以做的一件事是将JSON转换为字符串，对其进行解码以创建另一个JSON对象并将其分配给新商店。这与以前的商店不同。但必须有一个快速的方法。

如何创建具有不同商店对象的重复树，以便在展开/折叠树中的某个节点时，它不会以相同的方式在另一个节点中展开/折叠？

Answer 1

Ext.data.NodeInterface的方法为“copy”，参数为“deep”但在ExtJs 4.1.3深度克隆之前不起作用。更详细：他们在调用childNode.clone时忘记传递“id”参数。

对于仍在使用ExtJS＆lt; 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);

Answer 2

我做了类似的事情。

解析旧树以创建新树

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;
}

需要树存储的副本

2 个答案: