Question

我想在Backbone中定义一个扩展Backbone.View的父视图。所有子视图都将从父视图继承。但每次我创建子视图的新实例时，我都希望父视图中的函数能够执行。这是一个例子（小提琴是here）：

    SimpleSample = {};

    SimpleSample.ParentView = Backbone.View.extend({

        initialize: function(){
            //always execute this
            console.log('in parent view initialise');
        }
    });

    SimpleSample.Child1 = SimpleSample.ParentView.extend({

        initialize: function(){
            console.log('in child 1 initialise');
        }
    });


    SimpleSample.Child2 = SimpleSample.ParentView.extend({

    });

    SimpleSample.App = function(){
        this.start = function(){
            var child1 = new SimpleSample.Child1();
            var child2 = new SimpleSample.Child2();
        }
    }

    $(function(){
        var app = new SimpleSample.App();
        app.start();
    })

正如您所期望的那样输出：

in child 1 initialise
in parent view initialise

因为我已经为Child1定义了initialize（），所以在ParentView中定义的initialize（）中的代码不会运行。我不想从每个子节点显式调用ParentView函数。每当有一个从ParentView继承的视图的新实例时，是否可以在ParentView中始终执行一些代码？

Answer 1

我们一直使用Backbone-Super插件超过一年。经过充分测试的＆amp;易于添加到大多数项目。有了它，子类的初始化看起来像这样：

initialize: function(options) {
    console.log('in child 1 initialise');
    this._super(options);
}

它永远不会“自动”调用超类，但它确实足以使呼叫正确。它也适用于所有方法，而不仅仅是initialize，所以......

set: function(attributes, options) {
     this._super(attributes, options);
     console.log('Child 1 just had "set" called');
}

Answer 2

您可以覆盖构造函数（在父视图中）

SimpleSample.ParentView = Backbone.View.extend({

   initialize: function(options){
       //always execute this
       console.log('in parent view initialise');
   }

   constructor: function (options) {
       Backbone.View.apply(this, arguments);
       SimpleSample.ParentView.prototype.initialize.apply(this, options);
   }

});

负责从Backbone.View调用原始构造函数，并调用初始化函数。

现在您的子视图可以自由定义自己的初始化函数。

Answer 3

javascript中没有真正的超级。

您可以通过原型对象

显式调用父视图中的函数

SimpleSample.Child1 = SimpleSample.ParentView.extend({

    initialize: function(){
        console.log('in child 1 initialise');
        SimpleSample.ParentView.prototype.initialize.apply(this);
    }
});

http://jsfiddle.net/yzowyhc5/5/

始终在Backbone中执行父函数

3 个答案: