Question

我需要保存到localStorage的数据“savedData”，以便在修改/刷新页面时更新当前为空的视图模型，可能使用行中的KO映射插件：

ko.mapping.fromJS(this, retrievedData);

但当然它不起作用！

function viewModel() {

    var self = this;

    self.employees = ko.observableArray([]);

    self.removeEmployee = function (employee) {
        self.employees.remove(employee);
    };

    self.addEmployee = function () {
        self.employees.push(new Employee());
    };

    self.save = function () {
        var savedData = ko.toJSON(this);
        localStorage.setItem('savedData', savedData);
        //console.log('savedData', JSON.parse(savedData))
    }

    if (localStorage && localStorage.getItem('savedData')) {
        var retrievedData = JSON.parse(localStorage.getItem('savedData'));
        ko.mapping.fromJS(this, retrievedData);
    }
}

var vm = new viewModel();
ko.applyBindings(vm);

Answer 1

问题出在fromJS个参数中。第二个参数是映射选项，但您尝试传递数据。应正确使用

var viewModel = ko.mapping.fromJS(retrievedData, mappingOptions);

如果您不希望使用retreivedData将地图viewModel发送到mappingOptions

ko.mapping.fromJS(retrievedData, {}, viewModel);

这会将您的数据转换为viewModel，而无需任何特定的映射选项。

<小时/> 注意： 如果您使用两个参数second argument IS mapping object (__ko_mapping__ property defined)调用mapping.fromJS，它会将第二个参数视为viewModel并且您可以使用函数以不同的方式：

ko.mapping.fromJS(retrievedData, viewModel);

基本上，当您创建 viewModel时，此方案无效，而是更新以前使用映射viewModel创建了一些数据。

答案： 您应该通过传递空options参数来正确更新代码公司地图。当然，数据应首先出现：

if (localStorage && localStorage.getItem('savedData')) {
    var retrievedData = JSON.parse(localStorage.getItem('savedData'));
    ko.mapping.fromJS(retrievedData, {}, self);
}

使用mapping和localStorage更新KnockoutJS viewModel以维持持久性

1 个答案: