覆蓋ExtJS 5.1.1中的現有映射

我正在創建一個Viewport類，它包含3個項目; a 標題'container.Container'基類，表格'grid.Panel'和表格與form.Panel。覆蓋ExtJS 5.1.1中的現有映射

問題是ExtJS重寫我創建的頭並呈現爲'Grid Panel';因爲您會猜測它包含面板內部較小的「標題」並給出了這些錯誤：

[W] Overriding existing mapping: 'widget.header' From 'Ext.panel.Header' to 'Employee.view.MainHeader'. Is this intentional? 
[W] Overriding existing mapping: 'widget.gridpanel' From 'Ext.grid.Panel' to 'Employee.view.GridPanel'. Is this intentional?

這就是它的樣子！我還沒有爲Header類和Gridpanel定義任何別名。只給了xtype屬性多數民衆贊成在所有。爲什麼會發生這種情況？

謝謝？

這裏是頭：

Ext.define('Employee.view.MainHeader', { 
    extend: 'Ext.container.Container', 
    xtype: 'header', 
    requires: [ 
     'Ext.button.Button', 
     'Ext.form.field.Text' 
    ], 
    layout: { 
     type: 'hbox', 
     align: 'center' 
    }, 
    initComponent: function() { 
     var me = this; 
     Ext.apply(me, { 
      items: [{ 
       xtype: 'container', 
       width: 600, 
       padding: 5, 
       items: [{ 
        xtype: 'image', 
        height: 95, 
        width: 95, 
        src: 'https://openclipart.org/image/2400px/svg_to_png/69109/Free-Culture-Logo-Orange.png' 
       }] 
      }, { 
       xtype: 'container', 
       cls: 'search', 
       items: [{ 
        xtype: 'textfield', 
        width: 350 
       }, { 
        xtype: 'button', 
        text: 'Search', 
        handler: function() { 
         alert('this is the Search feature!'); 
        } 
       }] 
      }] 
     }); 
     me.callParent(arguments); 
    } 
});

和GridPanel中：

Ext.define('Employee.view.GridPanel', { 
    extend: 'Ext.grid.Panel', 
    xtype: 'gridpanel', 
    store: 'EmployeeStr', 
    title: 'ORest Employee Table', 
    viewConfig: { 
     markDirty: false, 
     stripeRows: false 
    }, 
    initComponent: function() { 
     var me = this; 
     Ext.apply(me, { 
      tools: [{ 
       type: 'refresh', 
       tooltip: 'Refresh the DB', 
       handler: function() {alert('Refresh click');} 
      }], 
      columns: [{ 
       xtype: 'numbercolumn', 
       dataIndex: 'id', 
       flex: 0, 
       text: 'ID' 
      }, { 
       xtype: 'gridcolumn', 
       dataIndex: 'code', 
       flex: 1, 
       text: 'Code' 
      }, { 
       xtype: 'gridcolumn', 
       dataIndex: 'firstName', 
       flex: 1, 
       text: 'First Name' 
      }, { 
       xtype: 'gridcolumn', 
       dataIndex: 'lastName', 
       flex: 1, 
       text: 'Last Name' 
      }, { 
       xtype: 'gridcolumn', 
       dataIndex: 'email', 
       flex: 1, 
       text: 'Email' 
      }, { 
       xtype: 'gridcolumn', 
       dataIndex: 'active', 
       flex: 0, 
       text: 'Status' 
      }], 
      dockedItems: [{ 
       xtype: 'pagingtoolbar', 
       store: 'EmployeeStr', 
       dock: 'bottom', 
       displayInfo: true 
      }] 
     }); 
     me.callParent(arguments); 
    } 
});

來源

2017-07-28 Nuri Engin

我不知道這是一個正確的調整！但是我在GridPanel類中添加了'header：false'配置。所以現在它走了... –

好！但這個配置會產生另一個錯誤;由於標題爲false，並且網格面板的標題未顯示Ext.panel.Title組件的標題文本或配置對象。當指定標題時，除非標頭設置爲false，否則將自動創建並顯示Ext.panel.Header。「@ http://docs.sencha.com/extjs/5.1.1/api/Ext.grid.Panel .html＃cfg-title –

看來你通過你的xtype設置（GridPanel中標題）ExtJS的定義預定義的別名覆蓋。

查看例如ExtJS的的GridPanel：

...  
alias: ['widget.gridpanel', 'widget.grid'] 
...

，如果你定義的xtype，你無論如何都應該以你的組件，並通過茨艾倫ExtJS的eprovided區分其他名稱的警告應該消失。

來源

2017-07-28 12:52:30 oberbics

我改變了所有視圖的'xtype'定義，並且它沒有任何警告地工作。此外，我已將'header'配置更改爲'true'並顯示**標題**。 –

覆蓋ExtJS 5.1.1中的現有映射

回答

相關問題