EXT--当defaultType与items的子组件默认xtype冲突时items的子组件的xtype为panel

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了EXT--当defaultType与items的子组件默认xtype冲突时items的子组件的xtype为panel相关的知识,希望对你有一定的参考价值。

示例图

技术分享

直接看下面示例代码:

/**
 * 获取导入表单
 * @returns {Ext.FormPanel}
 */
function getImportForm() {
    return new Ext.FormPanel({
        //...
        defaults : {
            labelWidth : 70,
            labelAlign : ‘right‘,
            defaultType : ‘textfield‘//子组件的默认类型
        },
        items : [{//xtype为panel(默认)
            columnWidth : 1,
            layout : ‘form‘,
            border : true,
            bodyBorder : true,
            bodyStyle : ‘border:1px solid red‘,            items : [{
                xtype : ‘label‘,
                text : ‘注意:导入模板中的域名必须为二级域名并在域名库中存在,否则将忽略不记‘
            }, {//xtype为textfield
                fieldLabel : ‘选择文件‘,
                inputType : ‘file‘,//input字段的type属性,诸如 radio、text、password、file等的元素都有type属性。
                name : ‘files‘,
                size : ‘1‘
            }]
        }]
    });
}

上面的代码是一个返回Ext.FormPanel的函数,其中在Ext.FormPanel中定义了defaults,里面有一个defayltType : ‘textfield‘ ,它定义了子组件的默认的xtype,但接下来在配置items时,items的子组件的xtype默认的是panel(参加官方API http://docs.sencha.com/extjs/3.4.0/#!/api/Ext.form.FormPanel),那么items的子组件的xtype到底是defaultType定义的‘textfield‘还是items默认指定的‘panel‘?下面在debug中我们来看一下:

技术分享

上面的信息明确显示了items这个唯一的子组件的defaultType是‘textfield‘--是不是说它的xtype就是‘textfield‘呢?接下来我们调用其getXType()的方法却发现不是这样:

技术分享

这个方法返回的信息应该是准确的,现在我们可以测试一下:将它的xtype指定为textfield

/**
 * 获取导入表单
 * @returns {Ext.FormPanel}
 */
function getImportForm() {
    return new Ext.FormPanel({
        //..
        items : [{//xtype为panel(默认)
            xtype : ‘textfield‘,//test
            //...
        }]
    });
}

测试结果:失败

技术分享

现在我们在换回默认的指定:panel

/**
 * 获取导入表单
 * @returns {Ext.FormPanel}
 */
function getImportForm() {
    return new Ext.FormPanel({
        //..
        items : [{//xtype为panel(默认)
            xtype : ‘panle‘,//test
            //...
        }]
    });
}

测试结果:正常

技术分享

这说明items的子组件的xtype是panel。其实想想也对,这个formPanel的items的子组件下面还嵌套2个子组件呢--怎么可能是textfield呢?

 

结论:当defaultType与items的子组件默认xtype冲突时items的子组件的xtype为panel(当然,这是在items的子组件的xtype未指定的情况下)。

以上是关于EXT--当defaultType与items的子组件默认xtype冲突时items的子组件的xtype为panel的主要内容,如果未能解决你的问题,请参考以下文章

Extjs win

EXT经验--查询items的xtype

Ext JS框架

Extjs4——表单与输入控件

EXT中FormLayout布局的提交和复位问题,总是提示TypeError: movie.form is undefined。

Android中ListView的Item的子控件获取焦点问题