javascript - Backbone.js:在模型中渲染 json 数据

Question

好的， super 基本的 Backbone 问题 - 我一直在寻找这个问题，但尽管有很多类似的问题，但我还是太慢了。请放心，我感到很惭愧。

无论如何，自虐够多了——为什么不渲染？

var app = app || {};

app.Option = Backbone.Model.extend({
url: 'http://localhost:4711/api'

//This url contains the following JSON: {"title": "Blahblah", "author": "Luke Skywalker"};  
});

 app.View = Backbone.View.extend({

el: 'body',

initialize: function(){
    this.model.fetch();
    this.model.bind('change', this.render(), this);
},

render: function(){
    this.$el.html(this.model.get('title'));
    return this;
}

});


$(function() {

 var option = new app.Option();
    this.homeView = new app.View({   //Tried changing this to a standard var declaration but didn't work
      model: option
    });
    this.homeView.render();
});

所以我希望在屏幕上看到 JSON“Blahblah”，但我什么也没看到。 JSON 被正确获取(我可以在 Firebug 控制台中看到成功的 GET 请求)并且我认为我已经确保在尝试呈现数据之前获取了数据...

那怎么了？控制台给我这个错误:“TypeError: (intermediate value).callback.call is not a function”

谢谢!

Answer 1

一件事是您在事件绑定(bind)中立即调用 this.render() 而不是仅仅绑定(bind)回调。改为这样做(使用 listenTo 以获得最佳实践):

initialize: function(){
    this.listenTo(this.model, 'change', this.render);
    this.model.fetch();
}

模型有没有可能实际上没有改变？您可以尝试绑定(bind)到 sync 而不是 change 以查看是否可行。

您还渲染了两次。一次直接使用 this.homeView.render() 一次通过事件处理程序。如果你真的想在 initialize 中保留你的模型获取并绑定(bind)到你不需要直接渲染的更改事件。

尝试一下，看看是否不能解决问题。