了解 Backbone 和 Marionette 视图生命周期答案

【问题标题】：Understanding Backbone and Marionette View lifecycle了解 Backbone 和 Marionette 视图生命周期
【发布时间】：2013-08-11 05:00:37
【问题描述】：

我是这个世界的新手，我需要了解 Backbone 和 Marionette 的一些概念。在这里，我试图解释我正在学习的一些概念。如果能得到一些关于它们的反馈，那就太好了。

render 函数定义了渲染模板的逻辑。完成后，将调用 onRender 回调。在这里，我假设渲染的视图尚未附加到 DOM。它由包含我附加到它的模板的tagName（默认为div）组成。要将该标记显式插入 DOM，我需要将其附加到某处。我错了吗？

一般来说，我会执行以下操作。

var view = new MyView();
view.render();
$("container").append(view.$el);

Marionette 使用区域的概念扩展了 Backbone。可以在区域上调用show 方法来呈现特定的视图。

var view = new MyView();
region.show(view);

在这种情况下，show 方法将自己调用 render 函数，最后，当视图的内容将放入 DOM 时，在该视图上调用 onShow。还好吗？

来自 Marionette doc 的还有另一个回调，称为 onDomRefresh。从我的实验中，我注意到这个方法是在onShow 之前调用的。所以，我的假设是该视图尚未附加到 DOM。但是医生说如下。

在视图被渲染后触发，已经显示在 DOM 中通过 Marionette.Region，并已重新渲染。

你能给出一些提示吗？

提前致谢。

【问题讨论】：

标签： javascript backbone.js marionette lifecycle backbone-views

【解决方案1】：

不管怎样，我相信你所说的一切或多或少都是正确的。

查看源代码（可用here -- 查找“DomRefresh”）MonitorDOMRefresh 位混合到每个视图中并添加此 API：

return function(view){
  view.listenTo(view, "show", function(){
    handleShow(view);
  });

  view.listenTo(view, "render", function(){
    handleRender(view);
  });
};

真的，所发生的只是将 2 个事件侦听器附加到视图，回调 (handleShow/handleRender) 设置布尔值 _isShown 或 _isRendered 并调用 triggerDomRefresh，它说：

function triggerDOMRefresh(view){
  if (view._isShown && view._isRendered){
    if (_.isFunction(view.triggerMethod)){
      view.triggerMethod("dom:refresh");
    }
  }
}

所以，你去吧...onDomRefresh 将在视图被渲染、显示然后重新渲染时被调用。

希望有帮助！

【讨论】：