我有一些简单的静态视图定义了一个主干应用程序,我正在尝试将一些子视图添加到等式中。
当我直接导航到路线时,子视图会正确呈现,但如果我通过超链接导航到路线,则布局会正确呈现,但子视图不会。
似乎有些东西超出了范围或尚未初始化,但需要一些帮助来确定是什么。
路由器
App.Router = Backbone.Router.extend({
routes: {
"": "home",
"tmp": "tmp",
},
home: function() {
var home = new App.Views.HomeLayout();
},
tmp: function() {
var tmp = new App.Views.TmpLayout();
}
});
意见
App.Views.HomeLayout = Backbone.View.extend({
el: $('body'),
template: _.template($('#tmplLayout').html()),
initialize: function() {
this.render();
},
render: function() {
$(this.el).append(this.template());
var menu = new App.Views.HomeMenuView({el: this.$('#menu')});
menu.render();
var page = new App.Views.HomeView({el: this.$('#content')});
page.render();
return this;
}
});
App.Views.HomeMenuView = Backbone.View.extend({
template: _.template($('#tmplHomeMenu').html()),
render: function() {
$(this.el).html(this.template());
return this;
}
});
App.Views.HomeView = Backbone.View.extend({
template: _.template($('#tmplHome').html()),
render: function() {
$(this.el).html(this.template());
return this;
}
});
该应用程序在我的 index.html(也是我所有视图模板的位置)中使用以下内容进行初始化:
<script>
new App.Router();
Backbone.history.start();
</script>
tmp 视图几乎是上述内容的复本,但具有不同的模板。
我尝试过的事情:
- 我把路由器的子视图减速也移动了,没有变化。
- 在每个子视图中调用 render 的初始化方法(类似于布局视图的定义方式),没有变化。