javascript - Backbone.js:智能更新已更改属性列表

Question

我知道这个问题已被讨论过多次，但我无法找到它的许多方面之一的答案，我将在这里尝试解释。

模型 save() 保持客户端和服务器之间的同步。 Backbone.js 促使您以以下两种方式之一使用它 (afaik):

1. 保存模型的所有项目:这会将所有内容发送到服务器，甚至仅在客户端使用的属性和属性没有改变。这是新模型的默认设置(当model.isNew() 返回 true)。
2. Save with patch:true 将只发送更改的属性模型到服务器。在 Backbone 中，这意味着仅changedAttributes() 返回的属性将被发送。

重点是 changedAttributes() 仅返回自上次 change 事件以来的更改。这对于不会一直更新的模型很有用，并且实际上可以对任何更改自动发出 ajax 请求。

但是如果你有一个不断变化的模型(例如代码/文本编辑器或可以拖放的元素并且它的位置应该被跟踪)，你不能只在每次变化时保存 事件。您需要按时间间隔保存自上次调用 save() 以来所有更改的属性。

您认为 Backbone.js 实际上对这种同步提供了很好的支持吗？ Bakcbone.js 是否跟踪自上次 save() 以来的变化(不仅自上次change 事件以来)？或者您必须“多次”执行此操作？

Answer 1

您必须使用自己的基础模型扩展 Backbone 模型。

var BaseModel = Backbone.Model.extend({
    save: function(key, val, options){
        var attrs
        if (key == null || typeof key === 'object') {
          attrs = key;
          options = val;
        } else {
           (attrs = {})[key] = val;
        }  
        attrs = _.extend(this.unsaved || {}, attrs);
        this.unsaved = {};
        return Backbone.Model.prototype.save.call(this, attrs, options);
    },
    set: function(key, val, options) {
       var attr
       if (key == null) return this;
       if (typeof key === 'object') {
          attrs = key;
          options = val;
       } else {
         (attrs = {})[key] = val;
       }
       this.unsaved = _.extend(this.unsaved || {}, attrs);
       return Backbone.Model.prototype.save.call(this, attrs, options);
    }
});

完全未经测试的代码，但应该非常接近您需要做的事情。