扩展自定义Backbone.Marionette视图.如何隐含地引发原型事件/ onRender?

Sea*_*son 4 javascript backbone.js marionette

我有一个观点:

var MultiSelectCompositeView = Backbone.Marionette.CompositeView.extend({

    events: {
        'click .listItem': 'setSelectedOnClick'
    },

    onRender: function () {
        console.log("MultiSelectCompositeView onRender has executed.");
    }
});
Run Code Online (Sandbox Code Playgroud)

我有另一个扩展MultiSelectCompositeView的视图:

var VideoSearchView = MultiSelectCompositeView.extend({

    events: _.extend(MultiSelectCompositeView.prototype.events, {
        'input @ui.searchInput': 'showVideoSuggestions',
        'click button#hideVideoSearch': 'destroyModel',
        'contextmenu @ui.videoSearchResults': 'showContextMenu'
    },

    onRender: function () {

        this.ui.playlistActions.append((new PlaySelectedButtonView()).render().el);
        this.ui.playlistActions.append((new SaveSelectedButtonView()).render().el);

        //  TODO: Is there a better way to do this?
        MultiSelectCompositeView.prototype.onRender.call(this, arguments);
    }
});
Run Code Online (Sandbox Code Playgroud)

我对VideoSearchView不会隐式扩展MultiSelectCompositeView的事件以及VideoSearchView必须手动调用MultiSelectCompositeView的onRender方法这一事实感到不满.

Backbone.Marionette有什么东西可以让我以更加无缝的方式扩展我的自定义视图吗?

Vit*_*huk 8

你在这里做错了两件事.

第一.不要更改MultiSelectCompositeView的原型,只需创建并使用新对象:

events : _.extend({}, MultiSelectCompositeView.prototype.events, {
  'input @ui.searchInput' : 'showVideoSuggestions'
  // ...
})
Run Code Online (Sandbox Code Playgroud)

第二.使用适当的参数执行super方法(使用applynot call):

onRender : function () {
  // ...
  MultiSelectCompositeView.prototype.onRender.apply(this, arguments);
}
Run Code Online (Sandbox Code Playgroud)

或者您可以使用"快捷方式":

var superProto = MultiSelectCompositeView.prototype;
var VideoSearchView = MultiSelectCompositeView.extend({

  onRender : function () {
    // ...
    superProto.onRender.apply(this, arguments);
  }

});
Run Code Online (Sandbox Code Playgroud)

另请参阅 - Backbone中的Super.