我已经完成了一个应用程序,我正处于缩小的过程中。当我构建应用程序时,我正在获取重复的组件。我在测试应用程序时注意到了这一点。每当我有一个网格时,就会有另一个网格在其下面绘制,具有相同的属性。我使用Ext.ComponentMgr.all.map查看我的所有应用程序的组件 - 当我这样做时,我注意到未构建的版本有1个app-main组件,而minified有2个。起初我以为我可以将此归因于警告或未构建版本中的错误。但是当我在chrome / IE中运行它时,我没有看到任何控制台警告或错误。
有没有办法告诉导致此错误的原因?下面是我在Viewport.js文件中调用的主视图。每个视图都正确定义了各自的别名。
Ext.define('MPL.view.MPLView', {
extend: 'Ext.container.Container',
requires: [
'Ext.grid.Panel',
'MPL.view.QuotePanelView',
'MPL.view.SearchPanelView',
'MPL.view.PartsPanelView',
'MPL.view.SvcPartsPanelView',
'MPL.view.ConsumedPartsView'
],
xtype: 'app-main',
layout: 'column',
overflowY: 'auto',
items: [
{
xtype: 'SearchPanel',
columnWidth: 1
},
{
xtype: 'QuoteGrid',
columnWidth: 1,
overflowY: 'auto',
height: 200
},
{
xtype: 'PartGrid',
overflowY: 'auto',
columnWidth: 1,
height: 250,
margin: '20 0 0 0',
hidden: true
},
{
xtype: 'SvcPartsGrid',
overflowY: 'auto',
columnWidth: 1,
height: 250,
margin: '20 0 0 0',
hidden: true
},
{
xtype: 'ConsumedPartsGrid',
overflowY: 'auto',
columnWidth: 1,
height: 250,
margin: '20 0 0 0'
}
],
listeners: {
.....
}});
这就是我的app.js的样子:
Ext.Loader.setConfig({
enabled : true
});
Ext.application({
name : 'MPL',
extend : 'MPL.Application',
appFolder : 'app',
requires : [ 'overrides.Theme' ],
controllers : [ 'MPLController' ],
models : [
'MPLModel',
'SearchCriteriaModel',
'PartsModel',
'LaborCodeModel',
'PartFieldsModel',
'SourceModel',
'PartsActionModel',
'ConsumedPartsModel'
],
stores : [
'MPLStores',
'SearchCriteriaStore',
'PartsStore',
'LaborCodeStore',
'PartFieldsStore',
'SourceStore',
'PartsActionStore',
'ConsumedPartsStore'
],
autoCreateViewport : true
});
我已经放置了console.logs,并在重复的网格上制作了更早的侦听器。同样,在缩小版本中,我在控制台中看到两个日志,在未缩小的版本中,我只看到一个。
仍在与此作斗争 - 这是一个重复的网格的例子
Ext.define('MPL.view.QuotePanelView', {
alias: 'widget.QuoteGrid',
extend: 'Ext.grid.Panel',
id: 'QuotePanel',
store: 'MPLStores',
columns: [
{ header: MPL.str.getQuoteIdHeader(), dataIndex: 'quoteId', flex: .9},
{ header: MPL.str.getManufacturerHeader(), dataIndex: 'manufacturer', flex: 1.2},
{ header: MPL.str.getVinHeader(), dataIndex: 'vin', flex: 2},
{ header: MPL.str.getYearHeader(), dataIndex: 'year', flex:.8},
{ header: MPL.str.getMakeHeader(), dataIndex: 'make', flex: 1},
{ header: MPL.str.getModelHeader(), dataIndex: 'model', flex: 1},
{ header: MPL.str.getSalesIdHeader(), dataIndex: 'salesPersonId', flex: 1.23},
{ header: MPL.str.getCustIdHeader(), dataIndex: 'customerId', flex: 1},
{ header: MPL.str.getQuoteStatusHeader(), dataIndex: 'status', flex: 1},
{ header: MPL.str.getCreatedDateHeader(), dataIndex: 'createdOn', dateFormat: "Y-m-d", flex: 2}
],
listeners: {
itemclick: function(dv, record, item, index, e) {
MPL.app.fireEvent("FindParts", dv, record, item, index, e);
},
beforerender: function(component, eOpts){
console.log(' id - ' + component.getId());
}
}
});
答案 0 :(得分:0)
我在这个问题上遇到了困难。我在每个重复组件的beforerender函数中处理它。由于我注意到渲染器渲染了相同的项目,因此我冒昧地删除它以及附加到先前版本的所有内容。
beforerender: function(component, eOpts){
if(!alreadyRendered){
alreadyRendered = true;
previousComponent = component;
}
else{
previousComponent.removeAll(true);
}
}