javascript - 木偶“未捕获的类型错误：对象 [对象对象] 没有方法 'render'”，带有 ItemView

Question

在 Bakbone Marionette 中，我试图显示一个带有模型数据的 IteView。来自其余 api 的 JSON 数据很好。问题是，每当我尝试在区域内显示视图时，它都会显示上述错误。

这是代码：

TestDataModel = Backbone.Model.extend({

    url: function(){
        return '/test.php?api=getTestData
    }
});

TestDataView = Backbone.Marionette.ItemView.extend({

    template: Handlebars.compile($('#testing-template').html()),

    initialize: function(){
        _.bindAll(this);

        // I want to bind render when the model changes        
        this.model.on('change', this.render, this);        

        this.model.fetch();
    }

});


<script id='testing-template' type='text/x-handlebars-template'>
    Testing template: {{test_token1}} {{test_token2}}
</script>

// this the main function that render the data on a main base page region.
onRender: function(){

    var testModel = new TestDataModel.Model();
    var testView = new TestDataView({
         model:testModel
    });
    this.test_region.show(testView);
}

Answer 1

使用 onShow 而不是 onRender。调用 onRender 时区域尚未设置

Answer 2

不要从您的视图初始化程序中调用 fetch 。

TestDataModel = Backbone.Model.extend({

    url: function(){
        return '/test.php?api=getTestData
    }
});

TestDataView = Backbone.Marionette.ItemView.extend({

    template: Handlebars.compile($('#testing-template').html()),

    initialize: function(){
        _.bindAll(this); 
        this.model.on('change', this.render, this);        
    }

});


<script id='testing-template' type='text/x-handlebars-template'>
    Testing template: {{test_token1}} {{test_token2}}
</script>

// this the main function that render the data on a main base page region.
onRender: function(){
    var self = this;
    var testModel = new TestDataModel.Model();
    var testView = new TestDataView({
         model:testModel
    });
    this.testModel.fetch().done(function(){
      self.test_region.show(testView);
    });
}

Answer 3

尝试使用 listenTo 约定，而不是绑定模型：

TestDataView = Backbone.Marionette.ItemView.extend({

    template: Handlebars.compile($('#testing-template').html()),

    initialize: function () {

        this.listenTo(this.model, 'change', this.render);

        this.model.fetch();
    }
});

就像我上面所说的，如果这仍然不起作用，那么您要么缺少某些东西，要么您需要提供自己的渲染。