Question

我在backbone.js项目中遇到this问题。

这是我的观点：

app.SomeView = Backbone.View.extend({
  render: function() {
    var that = this;
    $.getJSON(someURL, function(result) {
      that.property = result.something;
    });

    return this;
  }
})

令人费解的是，getJSON回调that.property内部已设置，但只要该功能完成 - 即return this - that.property等于undefined，与this.property相同。

我做错了什么？

Answer 1

正如我的评论所述，$.getJSON是异步的。 render功能会在$.getJSON获取相应的网址时继续执行，因此return this;会在that.property = result.something

之前执行

Answer 2

不确定为什么不使用模型。回答你的问题，有不同的解决方案，第一个：

使用事件：

app.SomeView = Backbone.View.extend({
  render: function() {
    var that = this;
    $.getJSON(someURL, function(result) {
      that.property = result.something;
      that.trigger('DataLoaded', that);
    });

    return this;
  }
});
var view = new app.SomeView();
view.on('DataLoaded', function(theView){ 
  console.log( theView );
});

第二个，你需要添加一个回调并传递它：

app.SomeView = Backbone.View.extend({

  render: function(callback) {
    var that = this;
    $.getJSON(someURL, function(result) {
      that.property = result.something;
      callback(that);
    });
    return this;
  }
});
var view = new app.SomeView();
view.render( function(theView){ 
  console.log( theView );
});

我的答案是为了解决您创建的问题而编写的。但是为了长期改进，你知道Models有一个fetch方法，它基本上从服务器加载JSON并将它与Model相关联吗？ http://backbonejs.org/#Model-fetch 这就是我将加载JSON的方式：

app.SomeModel = Backbone.Model.extend({
  urlRoot : someURL
});
app.SomeView = Backbone.View.extend({
  initialize : function(){
     this.model.on('change', this.render);
  },
  render: function() {
    console.log( this.model.toJSON() );
    return this;
  }
});
var view = new app.SomeView(new app.SomeModel());
view.model.fetch();

在backbone.js中的jQuery回调中绑定它

2 个答案: