免责声明:我对 ExtJS(版本 5.01)比较陌生。我希望能联系到一些 ExtJS 专家来为我指明正确的方向:
在 items
配置内指定 initComponent
方法时,我收到错误。下面的代码生成错误:
“未捕获类型错误:无法读取未定义的属性“项目””
当北子面板的'initComponent'函数被注释掉时,错误消失。我感觉我错过了初始化顺序的某些内容。
问:如何在 items
配置中指定子项目的 initComponent
方法?/p>
Ext.define('MyApp.view.TestView', {
extend: 'Ext.panel.Panel',
title: 'Parent',
height: 300,
layout: 'border',
items: [{
xtype: 'panel',
region: 'north',
title: 'North Child',
/* Problematic function: If commented, it works */
initComponent: function(){
console.log("test north child");
this.callParent(arguments);
}
}],
initComponent: function(){
console.log("Test parent");
this.callParent(arguments);
}
});
最佳答案
简短回答:您无法在子级上定义 initComponent
,因为您无法在子级上执行任何其他地方无法执行的操作。
InitComponent
在创建组件“MyApp.view.TestView”的实例时执行(您仅在此处使用Ext.define
定义了它)。它可以使用 Ext.create('MyApp.view.TestView',{
) 创建,或者通过创建另一个将此组件添加为项目的 View ,或者通过派生另一个组件 (extend :'MyApp.view.TestView'
).
所有子组件也会在创建 'MyApp.view.TestView' 时创建,因此子组件上的 initComponent 函数是多余的,因为没有父组件就无法创建子组件,因此父组件的 initComponent 可以是用于您想要在子组件的 initComponent 中执行的所有操作。
如果你需要某事。要在添加项目之前进行计算,您将按以下步骤操作:
Ext.define('MyApp.view.TestView', {
extend: 'Ext.panel.Panel',
title: 'Parent',
height: 300,
layout: 'border',
initComponent: function(){
var me = this,
tf = Ext.getCmp("someTextField"),
myTitle = (tf?tf.getValue():'');
Ext.applyIf(me,{
items: [{
xtype: 'panel',
region: 'north',
title: myTitle,
}]
});
this.callParent(arguments);
}
});
请参阅文档 Ext.applyIf 到底做了什么(以及它与 Ext.apply 有何不同,因为该函数有时也很方便)。
关于javascript - 项目配置中的 EXTJS 内联 initComponent 方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25615965/