示例图

直接看下面示例代码:

/**
* 获取导入表单
* @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的更多相关文章

  1. vue组件之间的通信以及如何在父组件中调用子组件的方法和属性

    在Vue中组件实例之间的作用域是孤立的,以为不能直接在子组件上引用父组件的数据,同时父组件也不能直接使用子组件的数据 一.父组件利用props往子组件传输数据 父组件: <div> < ...

  2. Vue父组件向子组件传递一个动态的值,子组件如何保持实时更新实时更新?

    原文:https://blog.csdn.net/zhouweixue_vivi/article/details/78550738 2017年11月16日 14:22:50 zhouweixue_vi ...

  3. Vue父组件传递异步获取的数据给子组件

    问题场景: 当父组件传给子组件的数据是在父组件中异步获取的时候,如何让子组件获取期望的值? 在父组件中: 首先在data()中定义data_detail为空: data(){ data_detail: ...

  4. uni-app 父组件引用子组件时怎么调用子组件的方法

    1.写一个简单的子组件main/index.vue: <template> <view> </view> </template> <script& ...

  5. 安卓开发笔记——Menu菜单组件(选项菜单,上下文菜单,子菜单)

    菜单是用户界面中最常见的元素之一,使用非常频繁,在Android中,菜单被分为如下三种,选项菜单(OptionsMenu).上下文菜单(ContextMenu)和子菜单(SubMenu). 菜单的实现 ...

  6. 042——VUE中组件之子组件使用$on与$emit事件触发父组件实现购物车功能

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. Vue 父组件向子组件传值,传方法,传父组件整体

    父子组件传值 1.父组件调用子组件时绑定属性,例如-> :title="title" 2.子组件中在props中声明title:props:['title','msg'] 3 ...

  8. vue.js组件之j间的通讯一 子组件接受父祖件数据

    Vue2.0的三种常用传值方式.父传子.子传父.非父子组件传值 在Vue的框架开发的项目过程中,经常会用到组件来管理不同的功能,有一些公共的组件会被提取出来.这时必然会产生一些疑问和需求?比如一个组件 ...

  9. 42.VUE学习之--组件之子组件使用$on与$emit事件触发父组件实现购物车功能

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. pip在windows域下使用代理安装package方法

    首先说明下,本人在公司使用windows域账户代理上网,用pip在线安装package 返回ProxyError,类似Tunnel connection failed: 407 authenticat ...

  2. Centos与win8.1的双系统

      背景:win8.1系统已经安装完成,并在此基础之上使用光盘或者U盘来安装centos系统,最终实现双系统   1.         在win8.1系统下查看磁盘及分区情况   2.         ...

  3. jquery设置元素readonly和disabled(checkbox只读)

    jquery api中提供了对元素应用disabled和readonly属性的方法:1,readonly 代码示例: $('input').attr("readonly",&quo ...

  4. Cocos2d-x 3.0标签类Label

    Cocos2d-x 3.0后推出了新的标签类Label,这种标签通过使用FreeType[1]来使它在不同的平台上有相同的视觉效果.由于使用更快的缓存代理,它的渲染也将更加快速.Label提供了描边和 ...

  5. [译] 开发者角度,王道之论:Android 与 Windows Phone

    前几天,在codeproject搜索Silverlight资料,偶然看到这篇文章,耐心读了2遍,非常不错:文章通过访谈聊天形式叙述,2位主角目前在<斯法克斯国家工程学院>软件学院上学. 周 ...

  6. [视频]MAC中如何单独放大文本字体

    我们知道使用MAC触控板的双指合拢手势可以进行放大或缩小操作,但其对应的是整个界面内容的放大及缩小,如果仅对其文本内容进行放大或缩小,可使用快捷键进行操作. 默认的 ”Command” + “=“   ...

  7. YCM的安装与配置

    花了好几天的时间,总算把YCM装上了.期间遇到了各种问题,主要还是因为刚进linux,对linux环境不熟, 命令资料等查了半天.当然,YCM也普遍被认为是一种安装配置复杂,但使用起来超简单的插件. ...

  8. JAVA多线程学习2--线程同步

    一.线程同步介绍 同步:就是协同步调,按照预定的先后顺序执行.比如:你说完我再说. 线程同步:访问同一个共享资源的时候多个线程能够保证数据的安全性.一致性. 二.JAVA中实现线程同步的方法 实现进程 ...

  9. How to check Windows 7 OS is permanently activated?[Windows 7]

    Press Windows + R, then you can enter : slmgr.vbs -xpr

  10. python time模块和datetime模块详解

    一.time模块 time模块中时间表现的格式主要有三种: a.timestamp时间戳,时间戳表示的是从1970年1月1日00:00:00开始按秒计算的偏移量 b.struct_time时间元组,共 ...