javascript - 一次保存多个 Backbone 模型

Question

我有一个包含大量模型的 Backbone 集合。

每当在模型上设置特定属性并保存它时，就会触发大量计算并重新呈现 UI。

但是，我希望能够同时在多个模型上设置属性，并且只在所有设置完成后才进行保存和重新渲染。当然，我不想为一次操作发出多个 http 请求，也绝对不想重新呈现界面十次。

我希望在 Backbone.Collection 上找到一个保存方法，它可以计算出哪些模型 hasChanged()，将它们作为 json 组合在一起并发送到后端。然后可以通过集合上的事件触发重新渲染。没有这样的运气。

这似乎是一个很常见的要求，所以我想知道为什么 Backbone 没有实现。这是否违反 RESTful 架构，将多个内容保存到单个端点？如果是这样，那又怎样？发出 1000 个请求来持久化 1000 个小项目是不可能的。

那么，使用我自己的保存方法来扩充 Backbone.Collection 的唯一解决方案是遍历其所有模型并为所有已更改的模型构建 json 并将其发送到后端吗？或者有没有人有更简洁的解决方案(或者我只是遗漏了什么!)？

Answer 1

我最终用几种方法来扩充 Backbone.Collection 来处理这个问题。

saveChangeMethod 创建一个虚拟模型以传递给 Backbone.sync。模型的所有主干同步方法都需要它的 url 属性和 toJSON 方法，因此我们可以轻松地解决这个问题。

在内部，模型的 toJSON 方法仅返回其属性的副本(将发送到服务器)，因此我们可以愉快地使用仅返回模型数组的 toJSON 方法。 Backbone.sync 对此进行字符串化，这只为我们提供了属性数据。

成功时，saveChanged 触发集合上的事件以处理一次。加入了一些代码，使其针对任何批处理模型中已更改的每个属性触发一次特定事件。

Backbone.Collection.prototype.saveChanged = function () {
    var me = this,
        changed = me.getChanged(),
        dummy = {
            url: this.url,
            toJSON: function () {
                return changed.models;
            }
        },
        options = {
            success: function (model, resp, xhr) {
                for (var i = 0; i < changed.models.length; i++) {
                    changed.models[i].chnageSilently();
                }
                for (var attr in changed.attributes) {
                    me.trigger("batchchange:" + attr);
                }
                me.trigger("batchsync", changed);
            }
        };
    return Backbone.sync("update", dummy, options);
}

然后我们只需要集合上的 getChanged() 方法。这将返回一个具有 2 个属性的对象，一个已更改模型的数组和一个标记哪些属性已更改的对象:

Backbone.Collection.prototype.getChanged = function () {
    var models = [],
        changedAttributes = {};
    for (var i = 0; i < this.models.length; i++) {
        if (this.models[i].hasChanged()) {
            _.extend(changedAttributes, this.models[i].changedAttributes());
            models.push(this.models[i]);
        }
    }
    return models.length ? {models: models, attributes: changedAttributes} : null;
}

虽然这是对主干“更改模型”范例的预期用途的轻微滥用，但批处理的全部意义在于我们不希望在模型更改时发生任何事情(即触发任何事件)。

因此，我们必须将 {silent: true} 传递给模型的 set() 方法，因此使用 backbone 的 hasChanged() 来标记等待保存的模型是有意义的。当然，如果您出于其他目的静默更改模型，这将会有问题 - collection.saveChanged() 也会保存这些，因此值得考虑设置一个替代标志。

无论如何，如果我们这样做，在保存时，我们需要确保 backbone 现在认为模型没有改变(不触发它们的改变事件)，所以我们需要手动操作模型，就好像它没有改变。 saveChanged() 方法迭代我们更改的模型并在模型上调用这个 changeSilently() 方法，它基本上只是没有触发器的 Backbone 的 model.change() 方法:

Backbone.Model.prototype.changeSilently = function () {
    var options = {},
    changing = this._changing;
    this._changing = true;
    for (var attr in this._silent) this._pending[attr] = true;
    this._silent = {};
    if (changing) return this;

    while (!_.isEmpty(this._pending)) {
        this._pending = {};
        for (var attr in this.changed) {
        if (this._pending[attr] || this._silent[attr]) continue;
        delete this.changed[attr];
        }
        this._previousAttributes = _.clone(this.attributes);
    }
    this._changing = false;
    return this;
}

用法:

model1.set({key: value}, {silent: true});
model2.set({key: value}, {silent: true});
model3.set({key: value}, {silent: true});
collection.saveChanged();

回复。 RESTfulness .. 对集合的端点执行 PUT 以更改其“某些”记录是不太正确的。从技术上讲，PUT 应该替换整个集合，但在我的应用程序真正需要替换整个集合之前，我很乐意采用务实的方法。