Question

I am learning Backbone.

I am wondering whether or not a Backbone View always requires a Backbone Model.

For example, let’s say I have a panel that contains two child panels. The way I would structure this is with a parent view for the main panel, then two child views for the child panels…

    var OuterPanel = Backbone.View.extend({
        initialize: function() {
            this.innerPanelA = new InnerPanelA(innerPanelAModel);
            this.innerPanelB = new InnerPanelB(innerPanelBModel);
        },
    });

    var outerPanel = new OuterPanel();

The parent view is really just a container. It may have some controls in it, but no data that needs to be persisted. Is this the proper way to do it? Or is this bad practice?

Thnx (in advance) for your help

Answer 1

As said in Backbone.View docs

Backbone views are almost more convention than they are code — they
don’t determine anything about your HTML or CSS for you, and can be
used with any JavaScript templating library.

In other words, if you don’t have a model, don’t use a model. On the other hand, I would inject the children models as options to the outer view instance and not rely on global variables, something like this:

var OuterPanel = Backbone.View.extend({
    initialize: function(options) {
        this.innerPanelA = new InnerPanelA({model: options.modelA});
        this.innerPanelB = new InnerPanelB({model: options.modelB});
    }
});

var outerPanel = new OuterPanel({
    modelA: innerPanelAModel,
    modelB: innerPanelBModel
});