backbone 查看为什么我无法在初始化时触发 UI 事件?
backbone view why can't I trigger UI event in initialize?
我在我的 html 中使用 bootstrap 选项卡,并在事件和模型中使用 backbone。我想为 bootstrap 触发选项卡显示事件,以便我可以处理该事件以创建另一个视图(子视图)。
这是我的代码:
var HeaderView = Backbone.View.extend({
...
events : {
'shown.bs.tab ul.nav-tabs>li>a': 'onTabShown'
},
initialize:function() {
console.log("Header view initialize executing...");
this.template =_.template(UserTemplate, this.collection);
this.render();
this.$el.find('div.toolbar ul.nav-tabs>li:first>a').tab('show');
//$('ul.nav-tabs>li:first>a').tab('show');
},
onTabShown: function() {
console.log('tab shown event!');
}
...
}
但是,即使初始化代码执行成功,标签显示事件也没有触发。就此而言,在 initialize() 中引发的任何 UI 事件都不会触发。
如果我在创建后在视图模块外部调用事件触发器,这将起作用。
有没有可能UI事件没有被触发,因为视图还没有完全初始化,初始化还在执行?似乎解决方法是从该视图之外的其他代码调用选项卡显示事件的触发器。有没有更好的方法或做法?
这不起作用,因为您没有调用 "delegateEvents"。
将 this.delegateEvents() 添加到您的初始化中,它将起作用。
现在,它没有按预期工作的原因是因为您正在初始化方法中完成所有工作,Backbone.View 构造函数在委托事件之前调用该方法。在 Backbone.View 的初始化方法中除了初始化之外做任何事情都被认为是一种非常糟糕的做法。另外,节省时间,使用 Marionette...
我在我的 html 中使用 bootstrap 选项卡,并在事件和模型中使用 backbone。我想为 bootstrap 触发选项卡显示事件,以便我可以处理该事件以创建另一个视图(子视图)。
这是我的代码:
var HeaderView = Backbone.View.extend({
...
events : {
'shown.bs.tab ul.nav-tabs>li>a': 'onTabShown'
},
initialize:function() {
console.log("Header view initialize executing...");
this.template =_.template(UserTemplate, this.collection);
this.render();
this.$el.find('div.toolbar ul.nav-tabs>li:first>a').tab('show');
//$('ul.nav-tabs>li:first>a').tab('show');
},
onTabShown: function() {
console.log('tab shown event!');
}
...
}
但是,即使初始化代码执行成功,标签显示事件也没有触发。就此而言,在 initialize() 中引发的任何 UI 事件都不会触发。
如果我在创建后在视图模块外部调用事件触发器,这将起作用。
有没有可能UI事件没有被触发,因为视图还没有完全初始化,初始化还在执行?似乎解决方法是从该视图之外的其他代码调用选项卡显示事件的触发器。有没有更好的方法或做法?
这不起作用,因为您没有调用 "delegateEvents"。 将 this.delegateEvents() 添加到您的初始化中,它将起作用。 现在,它没有按预期工作的原因是因为您正在初始化方法中完成所有工作,Backbone.View 构造函数在委托事件之前调用该方法。在 Backbone.View 的初始化方法中除了初始化之外做任何事情都被认为是一种非常糟糕的做法。另外,节省时间,使用 Marionette...