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未指定的情况下)。

时间: 2024-10-11 04:28:10

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

Android 子Activity组件在进程内的启动过程 && 子Activity组件在新进程中的启动过程

1.子Activity组件在进程内的启动过程 在Android Activity组件的启动过程http://blog.csdn.net/jltxgcy/article/details/35984557一文中,我们已经详细分析了Activity的启动过程,对于子Activity组件在进程内的启动过程,我们只分析它们之间的不同. 主要是2处,1是不需要创建新的任务栈,2是不需要创建新进程和子线程. 第1点,体现在如下代码上: -/Android/frameworks/base/services/ja

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

在Vue中组件实例之间的作用域是孤立的,以为不能直接在子组件上引用父组件的数据,同时父组件也不能直接使用子组件的数据 一.父组件利用props往子组件传输数据 父组件: <div> <child v-bind:my-message="parentMsg"></child>//注意传递参数时要用-代替驼峰命名,HTML不区分大小写 </div> 子组件: Vue.component('child', { // camelCase in Ja

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

菜单是用户界面中最常见的元素之一,使用非常频繁,在Android中,菜单被分为如下三种,选项菜单(OptionsMenu).上下文菜单(ContextMenu)和子菜单(SubMenu). 菜单的实现方式有2种:一种是通过布局文件xml生成菜单,另一种是通过代码生成. 三种菜单内容有点多,不过大体相似,一次性讲完吧,本人偏好代码动态生成,下面就以代码为例. 1.选项菜单(OptionsMenu) 先来看下选项菜单的效果图:   在一个Activity界面中点击手机Menu键,在屏幕下方弹出的菜单

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

父子组件传值 1.父组件调用子组件时绑定属性,例如-> :title="title" 2.子组件中在props中声明title:props:['title','msg'] 3.就可以在子组件中引用title Tips:避免父子组件传值时命名冲突 父子组件传方法方式一样 1.父组件调用子组件时绑定属性,例如-> :run="run" 2.子组件中props中声明run:props:['title','msg','run'] 3.子组件中的button引用r

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

原文:https://blog.csdn.net/zhouweixue_vivi/article/details/78550738 2017年11月16日 14:22:50 zhouweixue_vivi 阅读数:29918 最近用vue做一个新项目,经历了各种折磨,每次遇到问题都想大喊,格劳资上JQuery,氮素肯定是不行的,今天遇到一个小问题,Vue父组件向子组件传递一个动态的值,子组件只能获取初始值,不能实时更新? 这就有点折磨人了,设想的是,父组件发生变化获取数据,动态传递给子组件,子组

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

Vue2.0的三种常用传值方式.父传子.子传父.非父子组件传值 在Vue的框架开发的项目过程中,经常会用到组件来管理不同的功能,有一些公共的组件会被提取出来.这时必然会产生一些疑问和需求?比如一个组件调用另一个组件作为自己的子组件,那么我们如何进行给子组件进行传值呢?如果是电商网站系统的开发,还会涉及到购物车的选项,这时候就会涉及到非父子组件传值的情况.当然你也可以用Vuex状态管理工具来实现,这部分我们后续会单独介绍.我先给大家介绍Vue开发中常用的三种传值方式. Vue常用的三种传值方式有:

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

1.写一个简单的子组件main/index.vue: <template> <view></view> </template> <script> export default { data(){ return {} }, methods:{ childMethod() { console.log('childMethod do...') } } } </script> <style> </style> 在子组件

父组件调用子组件中的方法- this.$refs.xxx.子组件方法();

子组件中有一个说的方法 在父组件中去调用当你点击的时候 去调用子组件中的方法 fu.vue 在父组件的方法中调用子组件的方法,很重要 this.$refs.mychild.parentHandleclick(); { <template> <div> <button @click="clickParent">点击 调用子组件</button> <child ref="mychild"></child&

【Android 应用开发】 自定义组件 宽高适配方法, 手势监听器操作组件, 回调接口维护策略, 绘制方法分析 -- 基于 WheelView 组件分析自定义组件

博客地址 : http://blog.csdn.net/shulianghan/article/details/41520569 代码下载 : -- GitHub : https://github.com/han1202012/WheelViewDemo.git -- CSDN : http://download.csdn.net/detail/han1202012/8208997 ; 博客总结 : 博文内容 : 本文完整地分析了 WheelView 所有的源码, 包括其适配器类型, 两种回调接