1

我有一些简单的静态视图定义了一个主干应用程序,我正在尝试将一些子视图添加到等式中。

当我直接导航到路线时,子视图会正确呈现,但如果我通过超链接导航到路线,则布局会正确呈现,但子视图不会。

似乎有些东西超出了范围或尚未初始化,但需要一些帮助来确定是什么。

路由器

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 的初始化方法(类似于布局视图的定义方式),没有变化。
4

0 回答 0