提问者:小点点

了解主干和木偶视图生命周期


我是新来的,我需要了解骨干和木偶的一些概念。在这里,我试图解释我正在学习的一些概念。对他们有一些反馈会很棒。

渲染函数定义了渲染模板的逻辑。完成后,调用onRender回调。在这里,我认为呈现的视图没有附加到DOM。它由一个包含附加到它的模板的tagName(默认为div)组成。要显式地将该标记插入DOM,我需要将其附加到某个地方。我说错了吗?

一般情况下,我做以下几点。

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

木偶用区域的概念扩展主干。可以对区域调用show方法以显示特定视图。

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

在这种情况下,show方法将单独调用render函数,最后,当视图的内容放入DOM时,将在该视图上调用onShow。可以吗?

从木偶文件中还有另一个回调,名为onDomRefresh。从我的实验中,我注意到这个方法是在onShow之前调用的。因此,我的假设是视图尚未附加到DOM。但是医生说如下。

视图呈现后触发,已通过木偶显示在DOM中。区域,并已重新渲染。

你能给我一些提示吗?

提前谢谢。


共1个答案

匿名用户

无论如何,我相信你所说的一切或多或少都是正确的。

查看源代码(此处提供--查找“DomRefresh”),MonitorDOMRefresh位混合到每个视图中,并添加以下API:

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

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

实际上,所有发生的事情都是将两个事件侦听器连接到视图,回调(handleShow/handleRender)设置一个布尔值\isShown\isRendered并调用triggerDomRefresh,这表示:

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

在视图被渲染、显示和重新渲染的任何时候都将被调用。

希望有帮助!