2

スーパークラスのレンダリングを呼び出すことができません

Super = Backbone.View.extend({

     render : function(){
          //super class code here   (unable to call)
          return this;
     }

}); 

Sub = Super.extend({

     render : function(){
          //sub class code here    (called)
          return this;
     }

});

var view = new Sub();
view.render();

最初にサブクラスのレンダーを呼び出し、次にスーパークラスのレンダーを呼び出したいです。場合によっては、最初にスーパー クラスをレンダリングし、次にサブクラスをレンダリングします。

そのため、スーパークラスを変更せず、関数の名前を変更せずユーザーの要件に応じて、スーパークラス render の前または後にサブクラス render を呼び出すことは可能ですか?

それで、私は何が欠けていますか?

前もって感謝します。

4

3 に答える 3

4

ここで何かが足りないかもしれませんが、関数内の Super のプロトタイプで render メソッドを呼び出すことができますSub.render:

Super = Backbone.View.extend({
     render : function(){
          console.log('super render');
          return this;
     } 
});

Sub = Super.extend({
     render : function(){
          console.log('sub render');
          Super.prototype.render.call(this);
          return this;
     } 
});

var view = new Sub();
view.render();

そしてフィドルhttp://jsfiddle.net/WATqe/

于 2012-09-15T09:29:10.833 に答える
1

別のアプローチ:

Super = Backbone.View.extend({

     render : function(){
          //super class code here   (unable to call)
          if (typeof this.postRender === "function") {
            this.postRender();
          }
          return this;
     }

}); 

Sub = Super.extend({

     postRender : function(){
          //sub class code here    (called)
          return this;
     }

});

var view = new Sub();
view.render();

view.render() は super で render を呼び出し、postRender が定義されている場所 (super、sub、subsub など) に関係なく、存在する場合は postRender を呼び出します。

更新:スーパーを変更できない場合は、次を試すことができます:

Sub = Super.extend({
    initialize : function () {
       if (this.render) {
           var render = this.render;
           this.render = function () {
               render.call(this);
               // sub class render code goes here
           };
       }
    }
});
于 2012-09-15T07:52:08.580 に答える
0

必要に応じてライフサイクルを構築できます

例えば、

スーパーで

...
preRender_: function () {
    // maybe empty, for override
    ...
},
render_: function () {
    // do real render here
    ...
},
postRender_: function () {
    // maybe empty, for override
    ...
},
render: function () {
    preRender_();
    render_();
    postRender_();
}

サブで

// override preRender_, render_ or postRender_ as needed
于 2012-09-15T08:08:26.037 に答える