每个新的组件生命周期钩子都运行在哪个运行循环队列中?

时间:2015-07-29 22:56:40

标签: ember.js

从Ember博客来看,这些是新的组件生命周期钩子。

  

首次渲染(按顺序):

     
      
  • didInitAttrs在创建组件后运行,并确保传递attrs。在Ember 1.13中,属性将以this.get('attrName')。
  • 的形式提供   
  • didReceiveAttrs在didInitAttrs之后运行,它也在后续的重新渲染上运行,这对于所有渲染中相同的逻辑非常有用。当组件从内部重新渲染时,它不会运行。
  •   
  • willRender在呈现模板之前运行。它在模板因任何原因(初始和重新渲染,无论更改是由更改或重新渲染引起)更新时运行。
  •   
  • didInsertElement在模板渲染后运行,元素在DOM中。
  •   
  • didRender在didInsertElement之后运行(它也会在后续的重新渲染中运行)。
  •   
     

重新渲染(按顺序):

     
      
  • didUpdateAttrs在组件的属性发生更改时运行(但不是在重新呈现组件时,通过component.rerender,component.set或模板使用的模型或服务中的更改)。< / LI>   
  • didReceiveAttrs,与上述相同。
  •   
  • willUpdate在组件因任何原因重新呈现时运行,包括component.rerender(),component.set()或模板使用的模型或服务中的更改。
  •   
  • willRender,与上述相同
  •   
  • didUpdate在模板重新渲染后运行,DOM现在是最新的。
  •   
  • didRender,与上述相同。
  •   

这些是运行循环队列:

  
      
  • sync队列包含绑定同步作业
  •   
  • actions队列是常规工作队列,通常包含计划任务,例如许
  •   
  • routerTransitions队列包含路由器中的转换作业
  •   
  • render队列包含用于渲染的作业,这些作业通常会更新DOM
  •   
  • afterRender包含要在所有先前计划的渲染任务完成后运行的作业。这通常适用于第三方DOM操作库,只应在整个DOM树更新后运行
  •   
  • destroy队列包含完成其他作业计划销毁的对象的拆除作业
  •   

1 个答案:

答案 0 :(得分:0)

我在浏览器开发工具的帮助下看了Ember的运行循环是如何工作的,我当然可以这样说:

didInitAttrsdidReceiveAttrsrender队列中为1个简单组件触发:

Ember.component.extend()

并仅{{yield}}作为模板。

render队列中呼叫: Call in <code>render</code> queue