背景:
公司有使用backbone进行维护的考古项目,事件绑定和解除绑定,有使用on,off进行绑定解绑的,也有使用listenTo, stopListening 进行绑定解绑的,着实让人摸不着头脑;
今天来探究一下这两种的区别以及正确的使用方法;
on/off 在backbone中正确使用姿势
对实例绑定之后,要在组件remove时候进行解绑
例子中对TodoList的change进行了监听,如果TodoList不存在了,当前onChange监听就变成了 zombie objects in JavaScript apps,需要手动在当前视图remove时候添加off
var Todos = new TodoList;
Backbone.View.extend({
initialize: function () {
this.input = this.$('#new-todo');
this.allCheckbox = this.$('')[0];
//this.listenTo(Todos, 'add', this.addOne);
Todos.on('change', this.addOne, this); // 这里
this.listenTo(Todos, 'reset', this.addAll);
this.listenTo(Todos, 'all', this.render);
this.footer = this.$('footer');
this.main = $('#main');
Todos.fetch();
},
remove: function() {
// 单独移除某个绑定的事件
Todos.off('change', this.addOne, this);
// 如果要移除当前视图内容并移除绑定,调用下面的
Backbone.View.prototype.remove.call(this);
}
})
对于listenTo和 stopListening来说,不需要手动去解绑,因为在视图销毁时,backbone中的destroy内部会自动调用stopListening, 解绑所有的事件;
所以对于listenTo来说,只需要在初始化时候进行监听就可以了
例子:
var Todos = new TodoList;
Backbone.View.extend({
initialize: fu