Extjs Panel组件 render事件响应时的问题

今天在使用Ext.Panel时，发现的问题。开始准备使用html在Panel控件中插入一些html片断，然后在render事件时，取出html中的dom对象，进行下一步的操作，结果，提示有个obj为NULL。

通过分析发现，Ext.Panel的渲染顺利是这样子的。只是一个粗略，没有更细致的分析。

Ext.onReady(function() {
    var x = new Ext.Panel({
        title:"test",
        renderTo: 'p',
        width: 100,
        html: "Config中的HTML", //1
        listeners: {
            render: function() {
                this.body.update("Render事件中的HTML"); //2

            },
            resize: function() {
                this.body.update("Resize中更新的HTML"); //3

            }
        }
    });
});

在Ext.Panel激发render事件时，html的代码并没有被渲染到body中。所以在render过程中不应该对html片断中的对象进行操作。如果要向Panel中加入HTML片断，然后操作对象，可以在render中，先用this.body.update(html);插入HTML片断，然后再做想要做的工作。
resize事件是在render事件之后发生的，如果我把config中的html注释掉，最后看到的Panel中的内容是“Resize中更新的HTML”。如果再把3也注释掉，才会可以render中更新的HTML片断。这样看来，Panel最先激发render事件，然后再调用resize，等整个组件都创建结束，才会将this.body的内容渲染为config.html。

在ext-all-debug.js中也可以看到，afterRender事件。显示这是在render事件之后再调用的，所以如果你要在render做一些处理的话，config.html是不可以设置的，否则会将render中的工作都毁掉。

// private

    afterRender : function(){
        if(this.fromMarkup && this.height === undefined && !this.autoHeight){
            this.height = this.el.getHeight();
        }
        if(this.floating && !this.hidden && !this.initHidden){
            this.el.show();
        }
        if(this.title){
            this.setTitle(this.title);
        }
        this.setAutoScroll();
        if(this.html){//设置html
            this.body.update(typeof this.html == 'object' ?
                             Ext.DomHelper.markup(this.html) :
                             this.html);
            delete this.html;
        }