javascript - 单击 subview 时 Backbone.js 执行函数

Question

我有一个名为 DatesView 的 View 和一个名为 DateView 的 subview 。我想在单击 DateView 实例时在 DatesView 中执行一个函数。

var Date = Backbone.Model.extend({});

var Dates = Backbone.Collection.extend({
    model: Date
});

var DateView = Backbone.View.extend({
    events: {
        'click': 'clicked'
    },

    render: function () {
        this.$el.text(this.model.get('date'));

        return this;
    }
})

var DatesView = Backbone.View.extend({
    render: function () {
        this.collection.each(function (date) {
            var dateView = new DateView({model: date});

            this.$el.append(dateView.render().el)
        }, this);

        return this;
    },

    clicked: function() {
        console.log('clicked');
    }
})

var dates = new Dates([
    {date: '01'},
    {date: '02'},
    {date: '03'}
])

var datesView = new DatesView({collection: dates});

$('#container').html(datesView.render().el);

JSFiddle

正如您在示例中看到的，DateView 有一个单击事件设置，我想在 DatesView 中注册该事件。现在这样写不行。

Answer 1

我非常喜欢使用 Backbone 事件。您可以按如下方式使用它:

在 DateView 中触发事件

clicked: function () {
    Backbone.trigger('date:clicked');
}

在 DatesView 中监听事件

initialize: function () {
    this.listenTo(Backbone, 'date:clicked', this.clicked);    
}