backbone.js - 可配置的 Backbone.js 事件选择器

Question

我正在使用出色的框架 Backbone.js 开发简单的应用程序，如果我可以制作可配置的主干视图事件选择器会很好，例如这种方式它不起作用，因为它是错误的 js 语法：

return Backbone.View.extend({
    events: {
        'click ' + someConfigSelector: 'doSomethink'
    }
})

有没有其他方法可以在 Backbone 视图中设置事件？

Answer 1

看看这个小提琴：http: //jsfiddle.net/phoenecke/hyLMz/1/

您可以使用函数events代替对象。

return Backbone.View.extend({
    events: function() {
        // add some normal events to the hash
        var e = {
            'click #foo': 'doSomething1',
            'click #bar': 'doSomething2'
        };
        // add one where key is calculated
        e['click ' + someConfigSelector] = 'doSomething';
        // return events hash
        return e;
    }
});

这样，您可以添加您的事件，其中根据您的配置计算密钥。

Answer 2

对于动态事件，我更喜欢下面的方法，因为这个函数会在任何时候delegateEvent被调用。

根据在视图函数执行后调用的 delegateEvent 上的文档，您可以使用此技术动态创建事件：initialize

var TestView = Backbone.View.extend({    
    events: function () {
        var evt = {};
        evt['click ' + this._extraSelector] = '_onButtonClick';
        return evt;
    },
    initialize: function(config) {
        // passed in the selector, or defaulted 
        this._extraSelector = config.extraSelector || "BUTTON.default";
    }, 

    _onButtonClick: function() { }
});

var v = new TestView({ extraSelector: 'BUTTON.sample' });

Answer 3

你可以这样做：

return Backbone.View.extend({
    events: { },

    initialize:function() {
        this.events['click ' + someConfigSelector] = 'doSomethink';
    }
})

但它有点打破了如何在主干中声明事件的惯例，并使代码更难阅读。也许有人有更好的方法。