JavaScript-Knockout.js：克隆一个ObservableArray-Object

我想克隆/(深层)复制一个基因敲除js observableArray中的项目.

我在网上找不到有关此问题的任何信息.每个人都想要克隆克隆孔阵列;)

这是jsfiddle：
http://jsfiddle.net/drchef/dCHMC/1/

在那里,您可以看到,我正在使用在SO上找到的Deepcopy方法.

this.cloneLine = function() {
    //This 2 lines is what i found on SO. Should work, but doesn not :(
    //cloning the second line (sry hardcoded...)
    var lastLine = this.lines()[1];
    this.lines.push(jQuery.extend(true, {}, lastLine));
};

在viewmodel-output中,您可以看到副本正在运行…但是在内部,新项目和克隆项目的引用仍为相同的值.
如果您在新行中更改值,那么它在原始行中也会更改.

背景：
我有一个输入网格,如果用户在最后一行中并且在想要输入新行时单击“输入”,则该行与最后一行的数据相同

我不想编写任何方法,或者某个女巫正在克隆每个数据.在vm的每次更改中,我都必须更新映射. ;(

谢谢

解决方法:

您需要在Line视图模型中打开可观察对象.您可以使用ko.toJS实用程序方法执行此操作. Demo

function Line(line) {
    this.a = ko.observable(line && line.a);
    this.b = ko.observable(line && line.b);
    this.c = ko.observable(line && line.c);
};

var ViewModel = function() {
    var self = this;

    this.lines = ko.observableArray([]); 

    this.cloneLine = function(line) {
        var l = new Line(ko.toJS(line));
        self.lines.push(l);
    };

    this.cloneLastLine = function() {
        var lines = self.lines(),
            line = lines[lines.length - 1];
        self.cloneLine(line);
    };
}

var model = new ViewModel();

//Initial Data
model.lines.push(new Line({ a: 0, b: 1, c: 2}));
model.lines.push(new Line({ a: 2, b: 1, c: 0}));

ko.applyBindings(model);

标签：knockout-js,javascript,jquery
来源： https://codeday.me/bug/20191121/2052345.html