Backbone.js sub-view delegateEvents

flow

用Backbone.js写了一个预约日历界面。

如图点击CalendarView里的一个日期, 界面会通过下面的代码切换到CalendarScheduleView:

, onDay: function(m) {
    var calendarScheduleView = new CalendarScheduleView({model: m, cid:g_cid, delegate: this, days:this.model.days});
    $('.phone').html(calendarScheduleView.render().el);
}

注意$('.phone').html(calendarScheduleView.render().el),它会引发一场血案。

当点击返回,切换回日历界面的时候。CalendarView里的sub-view ReservedView会丢失它的点击事件:

, events: {
    'click .current':'onClick'
}

这就需要在ReservedView渲染后调用delegateEvents来恢复点击:

, render: function(){
    if (this.model) {
        this.$el.empty();
        this.$el.html(this.tpl(this.model.toJSON()));
        this.delegateEvents(this.events);
    }else{
        this.$el.html('');
    }
    return this;
}

这是因为delegateEvents只在View创建时调用一次

参考资料:

喜欢这篇文章就分享到微博吧!
留言请发送到
微信公众帐号
“技术派”

修订历史:


知识共享许可协议

关注@好看簿的蚂蚁

探讨技术、设计、人文和商业
相关的创业话题