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

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

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

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

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

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

最佳答案

我最终用几种方法来扩充 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 应该替换整个集合，但在我的应用程序真正需要替换整个集合之前，我很乐意采用务实的方法。

关于javascript - 一次保存多个 Backbone 模型，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12287359/