Understanding Backbone and Marionette View lifecycle

匿名 (未验证) 提交于 2019-12-03 03:06:01

问题:

I'm new to this world and I need to understand some of the concepts of Backbone and Marionette. Here I'm trying to explain some of the concepts I'm learning. It would be great to having some feedback on them.

The render function defines the logic for rendering a template. When it is finished, the onRender callback is called. Here I suppose the rendered view has been not attached to the DOM. It is composed by a tagName (the default is div) that contains the template I attached to it. To explicitly insert that tag into the DOM I need to append it somewhere. Am I wrong?

In general, I do the following.

Marionette extends Backbone with the concept of regions. The show method can be called on a region to present a specific view.

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

In this case, the show method will be call the render function on its own and finally, when the content of the view will be put in the DOM, the onShow is called on that view. Is it ok?

From Marionette doc there is also another callback called onDomRefresh. From my experiments, I've noticed that this method is called before onShow. So, my supposition is that the view has not been attached to the DOM yet. But the doc says the following.

Triggered after the view has been rendered, has been shown in the DOM via a Marionette.Region, and has been re-rendered.

Could you give some hints on it?

Thanks in advance.

回答1:

For what it's worth, I believe everything you've said is more or less correct.

Looking at the source (available here -- look for "DomRefresh") the MonitorDOMRefresh bits are mixed in to every view and add this API:

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

So really, all that's happening is the attachment of 2 event listeners to the view, and the callbacks (handleShow/handleRender) set a boolean _isShown or _isRendered and call triggerDomRefresh, which says:

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

So, there you go... onDomRefresh will be called anytime the view has been rendered, shown, and then re-rendered.

Hope that helps!



标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!