【问题标题】:Cloning a JS TreeModel tree克隆 JS TreeModel 树
【发布时间】:2015-02-13 09:27:15
【问题描述】:

我需要克隆一棵使用TreeModel.js 制作的树。 我真正需要做的是复制它,对其进行更改并检查节点数量是否减少。如果是这样,请恢复到原始树。这是我到目前为止复制它的一个小例子,这是不正确的:

var tree = new TreeModel();
var root = tree.parse({
    id: 0,
    name: "Root",
    children: [{id: 1, name: "1", children: []},{id: 2, name: "2", children: []}]
});

console.log(root)
var dup = tree.parse(root)
console.log(dup)

这是Fiddle。通过查看控制台,您将看到树之间的区别:

Node {config: Object, model: Object, children: Array[2], isRoot: function, hasChildren: function…}
Node {config: Object, model: Node, children: Array[2], isRoot: function, hasChildren: function…}

有没有办法正确克隆这样的结构?我寻找克隆 JS 对象,但仍然找不到准确克隆该对象的方法(例如模型等属性的原型......)

【问题讨论】:

    标签: javascript jquery treemodel


    【解决方案1】:

    你可以对第一棵树的模型进行深度克隆,然后再次解析得到第二棵树。

    以你为榜样:

    function deepCopy(obj) {
        // You can also use the jquery extend method here
        return JSON.parse(JSON.stringify(obj));
    }
    
    var dup = tree.parse(deepCopy(root.model));
    

    重要提示:如果你不深度克隆模型,而只是再次解析它,你最终会得到两棵树共享的相同底层模型,这肯定会导致不一致。

    【讨论】:

    • 你是写这个库的人吧?那么,与简单地做:tree.parse(root.model);有区别吗?
    • 太棒了。非常感谢图书馆和这个答案。 ;-)
    【解决方案2】:

    我终于找到了一个可以帮助遇到同样问题的人的解决方案:

    var tree = new TreeModel();
    var root = tree.parse({
        id: 0,
        name: "Root",
        children: [{id: 1, name: "1", children: []},{id: 2, name: "2", children: []}]
    });
    
    console.log(root)
    var dup = tree.parse(root.model)
    console.log(dup)
    

    parse 函数将模型作为参数,root 的模型似乎工作正常。

    编辑:此解决方案可能会带来不一致,因为 2 棵树基于相同的模型。 JNS的方案比较合适。

    【讨论】:

      【解决方案3】:

      为什么不尝试 jQuery 深拷贝?

      var dup = jQuery.extend(true, {}, tree)
      

      我试过你的小提琴,但它似乎不起作用。

      【讨论】:

      • 你检查控制台了吗?那是我可以检查结构的地方。是的,我尝试了深层副本,但仍然无法获得精确的副本。看看这个更新的 Fiddle 中的控制台:jsfiddle.net/pvzb9vd2/5
      • 是的,我意识到你不是在“日志”div 中而是在控制台上写的,为时已晚。我同意,这真的不是同一个对象。
      • 我想我找到了这个解决方案: var dup2 = tree.parse(root.model) *Edit: 好的,你也找到了 :)
      【解决方案4】:

      https://github.com/mrluc/owl-deepcopy 这对我有用。

      newTree = deepCopy(tree)

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2019-02-19
        • 2014-08-31
        • 2021-08-25
        • 1970-01-01
        相关资源
        最近更新 更多