Backbone 覆盖渲染函数的视图丢失子视图

Question

我正在尝试运行一些代码以在 header 完成渲染后调整 div 的大小。我查看了此处的答案和 Backbone 文档。这是我写的：

Backbone.View.extend({
    template: header_tpl,
    render: function() {
        this.$el.html(this.template({});

        setTimeout(function() {
           $(window).on("resize",function(){
               $(".somediv").height($(".someotherdiv").height())
           })
           .resize()
        }, 0);

        return this;
    },
    childViews: {
       // Some childViews in here
    }
});

这有效，但此视图中的子视图不会呈现。我认为这与在 this.template() 上传递的空 object 有关。 backbone 文档说要传递 this.model.attributes，但此视图没有模型。它是一个简单的 header，没有数据传递给它。

Answer 1

正如@CoryDanielson 的评论所指出的，Backbone 没有对 "childViews" 的默认处理。如果您的工作是制作一个 Backbone 视图渲染它的子视图，有很多相当简单的方法可以做到这一点。

但我认为您真正想要做的是在您的代码库中的其他地方保留某种内置于 Backbone.View 中的预构建 render 功能。由于您似乎唯一需要的扩展是将 resize 事件附加到 window，也许最好的选择是不要在 render 方法中执行此操作，然后您可以继续使用任何在您的代码库的其他地方预先构建。

Backbone.View.extend({
  template: header_tpl,
  // no override of render
  initialize: function() {
    setTimeout(function() {
       $(window).on("resize",function(){
           $(".somediv").height($(".someotherdiv").height())
       })
       .resize()
    }, 0);
  },
  childViews: {
   // Some childViews in here
  }
});

此代码应在实例化视图时附加事件，而不是在每次渲染时。

当然，如果您的代码库也可能改变默认的 initialize 方法，我们真的无法知道。在那种情况下，可能有一些选项可以通过扩展来覆盖默认方法（initialize、render、...），但仍然会在后台调用旧方法。

Backbone 覆盖渲染函数的视图丢失子视图

Backbone View overriding the render function loses childviews

backbone.js