在ExtJS 6.2 classic中,当我们扩展一个组件时,我们通常实现initComponent
。
在ExtJS modern上,Ext.Container
没有initComponent
,除了constructor
,哪个函数将替换Modern中的initComponent
?
我遇到了一个问题,因为我在构造函数中实现了组件初始化,当我再次显示组件时,它会再次运行构造函数,并将config
设置为先前更新的config
,因此组件会多次呈现它只应呈现一次的内容。
Ext.define('AppName.view.settings.CalloutBox', {
extend: 'Ext.Container',
xtype: 'calloutbox',
layout : {
type : 'hbox',
},
constructor: function(config) {
// Added this to avoid the bug I commented above.
if (config.cls) {
this.callParent(arguments);
return;
}
config.cls = `myclass`;
// Here I programmatically add elements. These cause the bug
// because on next run of this constructor these will be
// added again.
config.items = [{
xtype : 'container',
cls : `alert__icon-box`,
layout: {
type : 'vbox',
pack : 'center',
align : 'middle'
},
items: [{
xtype :'label',
cls : `alert__icon`,
html : `<i class="x-font-icon md-icon-alert"></i>`,
}]
}];
this.callParent(arguments);
}
});
更新
我发现了复制元素错误的原因。它是由重新创建CalloutBox
每次所处的模态而不是仅仅显示已经打开的模态引起的。
所以我们有了这个:
Ext.Viewport.add({ xtype: 'mymodal' }).show();
而现在:
const mymodal = Ext.getCmp('mymodal');
// If component already exists in DOM, just show it.
if (mymodal) {
mymodal.show();
return;
}
// Else we create and show it.
Ext.Viewport.add({ xtype: 'mymodal' }).show();
1条答案
按热度按时间1cosmwyk1#
在Modern Toolkit中查看
Container
的initialize
模板方法和其他类。尝试运行以下代码: