GoogleClosureLibrary 中的Component 模型纪要

要高效使用google的这个库需要正确理解它的Component模型，总的说来Component是这个库中所有控件和组件的基础类，有点象asp.net中的control这个基类，它定义了一个组件的生命周期过程规范和一些可覆写的方法。

 

一个组件在生命周期中大致会经过如下几个阶段：

1. 组件实例创建。
2. 构造dom元素，这步又可以通过两种方式来实现：完全创建法和冒充法(decorate).
3. 事件绑定。
4. 页面关闭事件回调：取消事件绑定并进行变量清理。

constructor	Component instance creation
createDom()	Component DOM structure building
decorateInternal() (optional)
enterDocument()	Post DOM-building initialization (such as attaching event listeners)
exitDocument()	Post DOM-removal cleanup (such as detaching event listeners)
dispose()	Component disposal
canDecorate()	Indicates whether the component can use a pre-existing element

事件绑定在enterDocument方法中完成，因为直到此时dom元才存在于document中，并可以使用getElement方法来查找dom中的元素。

 

子元素创建应该在decorateInternal方法里面做，可以使用decorate 方式，或者创建法，这里需要该手动调用render()方法？

参考文档： Component组件模型介绍

 

2010.11.25 Update:

• 如果组件含有其它的组件，一般应该在构造函数中创建子组件的实例。
• createDom方法用于完全的js界面生成，如果是decorate则应根据已有dom结构在decorateInternal方法中创建缺失的元素。
• enterDom方法除可用于事件绑定外，还可以调用子组件的render方法将子组件加载到文档结构中，如果是decorate则不必手动调用render方法。
• 如果只需创建类似zippy一样的功能性组件，而不需要维护自己的dom结构，则不必从component类继承，可以选择EventTarget即可，使之可以使用dispatchEvent方法引发事件和成为其它组件的监听目标。
• 元素事件类型：goog.events.EventType
• 组件事件类型：goog.ui.Component.EventType