Question

使用主干JS库来构建页面。我有一个集合，视图和路由器。目标是在页面中列出集合的所有条目。

集合

window.Artifact = Backbone.Model.extend({
    urlRoot:"/rest/artifacts",

    initialize:function(){
      this.artifacts = new ArtifactCollection();
    }
});

window.ArtifactCollection = Backbone.Collection.extend({

     model:Artifact,
     url:"/rest/artifacts"

});

var artifacts = new ArtifactCollection;

视图

window.findView = Backbone.View.extend({

    initialize:function () {
       console.log('Initializing Find View');
       this.template = _.template(tpl.get('find'));
    },

    render:function (eventName) {

    var data = { 'data' : artifacts.models };
            $(this.el).html(this.template( data ));
            return this;
    }
});

路由器程序

var AppRouter = Backbone.Router.extend({

routes:{
    "":"home",
    "contact":"contact",
    "get":"get",
    "find":"find",
    "requests/:id":"requests"
},

find:function(){

    artifacts.fetch( {
        success:function(){
            this.findView = new findView( );
            this.findView.render();
            $('#content' ).html( this.findView.el );
        }
    });
},

问题是，它大部分时间都有效，但有时不起作用。它抛出以下异常

Uncaught TypeError: object is not a function
artifacts.fetch.successmain.js:53
_.extend.fetch.options.successbackbone-0.9.2.js:760
jQuery.Callbacks.firejquery.js:1032
jQuery.Callbacks.self.fireWithjquery.js:1150
donejquery.js:7385
jQuery.ajaxTransport.send.callback

之前有人见过这类问题吗？

Answer 1

我在路由器中的这段代码中将this.findView重命名为this.find。 artifacts.fetch( { success:function(){ this.find = new findView( ); this.find.render(); $('#content' ).html( this.find.el ); } });现在一切正常。有人能解释这种变化的意义吗？

我不是肯定的，但我猜你在success函数中，this是对window的引用，当你有this.findView = new findView();时，你覆盖window.findView，当success函数再次运行并尝试调用new findView()时，导致“未捕获的TypeError：对象不是函数”。

Backbone Collection.fetch（）奇怪的行为

1 个答案: