Question

我有一个可以通过某个视图编辑的模型;但是，在视图的底部，用户应该选择保存或放弃所有更改。这意味着您需要存储要对模型进行的所有更改的列表，然后仅在单击“保存”按钮后进行更改。这听起来不必要地复杂，我想出了另一种方法，即创建模型的克隆并对视图中的模型进行更改。然后，如果用户单击“保存”，则删除旧模型并将其替换为新模型，否则将丢弃克隆模型。

这是一种可接受的方法，如果是这样，我该如何实施克隆过程？

这相当于再次从服务器获取数据（但似乎没有额外的HTTP请求）。

Answer 1

您可以使用clone方法。以下简短示例：

var Model = Backbone.Model.extend({});
var View = Backbone.View.extend({
    initialize: function() {
        this.realModel = this.model;
        this.model = this.realModel.clone();
    },
    onSave: function() {
        this.realModel.set(this.model.attributes);
    }
});

你也可以做一些不同的事情：

var Model = Backbone.Model.extend({});
var View = Backbone.View.extend({
    initialize: function() {
        // save the attributes up front, removing references
        this._modelAttributes = _.extend({}, this.model.attributes);
    },
    onSave: function() {
        // revert to initial state.
        this.model.set(this._modelAttributes);
    }
});

Answer 2

您可以尝试Backbone.Memento。

如果你不想使用它没问题。但是，你可以从代码库中了解它应该如何完成。

Answer 3

我通常使用视图上的对象缓存来解决此问题。这样我就不会为模型/视图管理添加任何不必要的开销。如果用户在不保存的情况下关闭视图，则会自然发生丢弃。

var Model = Backbone.Model.extend({
    'title': 'Hello'
});

var View = Backbone.View.extend({
    initialize: function() {

        // Holds temporary values until save
        this.cache = {};

    },
    onTitle: function() {
        this.cache.title = 'World';
    },
    onSave: function() {
       this.model.set( this.cache );
    }
});

如何在Backbone中克隆模型

3 个答案: