很好的关于声明周期的文章 dijit widget

来源：互联网发布：舆情监测系统python 编辑：程序博客网时间：2024/04/30 00:41

http://hi.baidu.com/commondcn/item/9c46ef262d5c79122b0f1ce3

DOJO Widget 详解

Dojo中对widget进行扩展存在两种形式

1) dojo.declare("inheritTest.myClass",[dijit._Widget, dijit._Templated],

这意味着你的widet继承自dojo widget的两个基类：dijit._Widget, dijit._Templated。

其中，在dijit._Widget类中存在六个方法，分别为：

l postscript

l create

l postMixInProperties

l buildRendering

l postCreate

l startup

来看一下默认的postscript方法

postscript: function(params, srcNodeRef){

this.create(params, srcNodeRef);

其中接收两个参数，回忆一下dojo提供的dijit组件的一般创建方法，例如：new dijit.form.FilteringSelect({store:myStore, label:’test’},dom);实际上，这两个参数即对应了postscript的两个参数，第一个是传入相关的属性，第二个是设定此widget被加载的dom节点。即我们通过在js中 new 或者在html中使用标签<div dojoType= inheritTest.myClass/>的方式加载widget时，第一步将调用postscript方法，而postscript方法将调用create方法。Create方法实际上执行了创建这个widget的流程。在此方法中包含了postMixInProperties，buildRendering，postCreate方法postMixInProperties在所有Properties被赋值以后调用，在此函数调用前我们可以看到执行如下语句：

if(params)

{

dojo.mixin(this,params);

}

将params传入的属性和widget原有的属性mixin.

接下来buildRendering()函数是处理template用的将templateString或者templatePath所定义的<DIV>的内容渲染到页面上。如果其中定义到了其他的widget将调用其的create将其生成。

在create函数执行的末端将调用postCreate函数，做生成widget后的一些处理。

Startup将在create执行完毕以后调用。

下面具体的看一下执行的流程：

建立一个base类：

dojo.declare("inheritTest.baseClass", [dijit._Widget, dijit._Templated],

{

widgetsInTemplate: true,

constructor:function(){

console.debug('base_constructor');

postMixInProperties:function(){

console.debug('base_postMixInProperties');

buildRendering:function(){

console.debug('base_buildRendering');

postCreate: function(){

console.debug('base_postCreate');

startup: function(){

console.debug('base_startup');

}

});

}

再建立一个child类：

dojo.declare("inheritTest.childClass",[dijit._Widget, dijit._Templated],

{

widgetsInTemplate: true,

templatePath :'inheritTest/template/childTemplate.html',

constructor:function(){

console.debug('child_constructor');

postMixInProperties:function(){

console.debug('child_postMixInProperties');

buildRendering:function(){

console.debug('child_buildRendering');

this.inherited(arguments);

postCreate: function(){

console.debug('child_postCreate');

startup: function(){

console.debug('child_startup');

}

});

}

在inheritTest.childClass的模板中我们调用了baseClass：<div><div dojoType=inheritTest.baseClass></div></div>

建立一个test.html内容如下：

</body>

执行程序，console输出如下：

2) dojo.declare("inheritTest.childClass",inheritTest.baseClass，{});

这采用了传统的继承方式，这种方式能够使用基类的所有方法和属性，但是除了构造函数以外，如果希望覆写基类的方法时执行基类的方法，则需要在覆写类中加入语句：this.inherited(arguments);