backbone event inherit

View Code
var Base = Backbone.View.extend({
                initialize: function () {
                    this._hello = "hello world!!";
                    console.log('Base::initialize');
                },
                events: {
                    'click .j-inherit-click': 'inheritClick',
                    'click .j-inherit-click2': 'inheritClick2'
                },
                inheritClick: function (event) {
                    event.preventDefault();
                    console.log('Base::inheritClick');
                },
                inheritClick2: function (event) {
                    event.preventDefault();
                    console.log('Base::inheritClick');
                },
                template: $('#sidebar').html(),
                render: function () {
                    this.$el.html(this.template);
                    return this;
                },
                promptColor: function () {
                    var cssColor = prompt("Please enter a css color");
                    this.set({color: cssColor});
                }
            });

            var Sidebar = Base.extend({
                initialize: function () {
                   // Base.prototype.initialize.apply(this, arguments);
                    this.constructor.__super__.initialize.apply(this, arguments);
                    console.log('Sidebar::initialize');

// 继承方式1
//                    var obj = {
//                        'click .j-inherit-click': 'inheritClick'
//                    };
//                    this.events = $.extend({}, Base.prototype.events, obj);
                },

//                events: {
//                    'click .j-inherit-click': 'inheritClick'
//                },

// 继承方式2
//                events: function () {
//                    var obj = {
//                        'click .j-inherit-click': 'inheritClick'
//                    };
//                    var obj2 = $.extend({}, Base.prototype.events, obj);
//                    return obj2;
//                },

// 继承方式3 推荐这种
                events: function () {
                    var obj = {
                        'click .j-inherit-click': 'inheritClick'
                    };
                    var obj2 = $.extend({}, this.constructor.__super__.events, obj);
                    return obj2;
                },

                inheritClick: function (event) {
                    event.preventDefault();
                    console.log('Sidebar::inheritClick');
                },

                inheritClick2: function (event) {
                    event.preventDefault();
                    console.log('Sidebar::inheritClick2 override Base::inheritClick2');
                },

                template: $('#sidebar2').html(),

                render: function () {
                    this.$el.html(this.template);
                    return this;
                }
            });
原文地址:https://www.cnblogs.com/leamiko/p/2955506.html