Question

我一直在查看一些代码并且无法决定在这种情况下应用的最佳做法：

假设我们有一个包含n个子视图的视图。我遇到了两种初始化它们的做法

1 in intitialize

initialize: function() {
  this.subViews = [];
  this.subViewModelCollection.each(function(model) {
    var view = new SubView({model: model});
    this.subViews.push(view);
    this.$el.append(view.el);
  }, this);
},

render: function() {
  _.invoke(this.subViews, 'render');
}

2内部渲染

initialize: function() {
  ... // render handles the subviews
},

render: function() {
  this.subViews = [];
  this.subViewModelCollection.each(function(model) {
    var view = new SubView({model: model}).render(); // render optional
    this.subViews.push(view);
    this.$el.append(view.el);
  }, this);
}

现在这些只是粗略的样本，但它们证明了我的困境。 initialize或render函数是否应该负责初始化子视图？就个人而言，我一直是后者版本的坚定拥护者，但我看到的一些代码让我对前者有所动摇。

那么，你在哪里初始化你的子视图，为什么你在那里做，为什么它比其他选项更好？

Answer 1

您应该最大化您在初始化时所做的工作量，因为这只会执行一次，并最大限度地减少您在渲染函数中执行的工作量，这通常可以多次调用（例如，在单个页面应用程序中）或响应式网页。）

如果您知道子视图的渲染方法永远不会更改生成的html，那么您也可以在initialize方法中调用子视图的render方法，并简单地将渲染元素附加到“主视图”中

如果您的子视图和主视图的渲染方法只被调用一次（作为加载页面或其他任何内容的一部分），您可能无关紧要，但通常最大限度地减少要完成的工作量渲染函数可能是很好的建议。

Answer 2

我会将实际的子视图渲染功能完全放入一个新功能，比如renderSubViews()。

这将提供更大的灵活性。

您可以从initialize或render调用此功能，并在应用程序增长/更改时轻松更改。
您可以将此新功能绑定到事件，即视图的reset事件。
这更符合逻辑。初始化或渲染主视图时自动渲染子视图是否有意义？一个人应该直接绑在另一个人身上吗？

初始化子视图

1 in intitialize

2内部渲染

2 个答案: