Question

我正在使用带有backbone适配器的tastypie和jquery来与DOM进行交互。我在骨干中发现了一些我无法理解的东西。我试图简化这个问题的代码。

这是我的app.js：

$(document).ready(function() {
    Point = Backbone.Model.extend({
        defaults:{
            lat:0,
            lng:0
        },
        urlRoot: '/api/v1/point' ,
        initialize: function(attributes){
            var that = this;
            $('#b1').bind('click',function() {
                that.set('lat',that.get('lat')+1);
            });
            $('#b2').bind('click',function() {
                that.save();
            });
            $('#b3').bind('click',function() {
                console.log(that.get('lat'));
            });
        }
    });

    point = new  Point ();

    //****

    $('#b1').click();
    $('#b2').click();
    $('#b3').click(); // >> 1

    $('#b1').click();
    $('#b2').click();
    $('#b3').click(); // >> 2

    //****
});

我的HTML：

<script src="/static/js/jquery.js"></script>
<script src="/static/js/backbone.js"></script>
<script src="/static/js/backbone-tastypie.js"></script>
<script src="/static/js/app.js"></script>

<button id="b1">b1</button>
<button id="b2">b2</button>
<button id="b3">b3</button>

如您所见，我正在呼叫点击代码中的按钮，控制台正在按预期记录“1”然后“2”。

当我在星号（// * ）之间删除代码并按下这些按钮'b1'，'b2'，'b3'，'b1'，'b2'，'时出现问题b3'在浏览器中手动并在控制台中获得'1'和'1'。

我等待服务器的响应1秒并在控制台中检查它但是app的行为仍然是相同的：'1'，'2'带有代码的星星和'1'，'1'，按下按钮。

你知道为什么吗？

Answer 1

我等待服务器的响应1秒钟并在控制台中检查它，但是[...]

手动更改模型（使用鼠标单击按钮）而非编程（click()）是此处的关键部分。

我假设您没有从服务器返回最终模型，因为Backbone update是您的模型，包含该数据。

请参阅section 53和

if (options.wait) {
  if (attrs && !this._validate(attrs, options)) return false;
  current = _.clone(this.attributes);
}

section 55

options.success = function(resp, status, xhr) {
  done = true;
  var serverAttrs = model.parse(resp);
  if (options.wait) serverAttrs = _.extend(attrs || {}, serverAttrs);
  if (!model.set(serverAttrs, options)) return false;
  if (success) success(model, resp, options);
};

Backbone.js documentation的

。特别是这些行：

var serverAttrs = model.parse(resp);（从响应中解析模型数据）

if (!model.set(serverAttrs, options)) return false;（更新模型的属性）

当您的第一个代码（按钮click()运行的代码）运行时，它会增加您的模型属性并在服务器返回之前对其进行记录。那

注意：使用wait选项或第一个代码中第二次按下按钮3中的setTimeout()将等同于此行为。

但你想要的是从你的服务器返回一个有效的模型（在持久化之后）。

非主题提示：您不应该在模型initialize r或constructor中绑定模型和视图，因为它会将它们绑得太紧而且它们不会是可以互换的。（对于这个问题，它肯定是可以接受的。;）

在主干中保存后丢失模型实例

1 个答案: