1

我一直在查看一些代码一段时间，无法决定在这种情况下应用的最佳实践：

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

1 内部初始化

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或-function是否应该render负责初始化子视图？就我个人而言，我一直是后一个版本的坚定拥护者，但我看到的一些代码让我更倾向于前者。

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

4

2 回答 2

4

您应该最大化您在初始化时所做的工作量，因为这只会完成一次，并尽量减少您在渲染函数中所做的工作量，该函数通常可能被多次调用（例如在单页应用程序或响应式网页中） ）。

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

如果您的子视图和主视图的渲染方法无论如何都只调用一次（作为加载页面或其他任何内容的一部分），那么您如何执行它可能并不重要，但通常会最大限度地减少渲染函数中要完成的工作量可能是个好建议。

于 2012-09-07T10:36:28.907 回答
0

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

这将允许更大的灵活性。

  • initialize您可以从或调用此函数render，并随着应用程序的增长/更改轻松更改它。
  • 您可以将此新功能绑定到事件，即reset视图的事件。
  • 这更符合逻辑。初始化或渲染主视图时自动渲染子视图是否有意义？一个应该直接与另一个绑定吗？
于 2012-09-09T19:19:24.813 回答