覆盖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中的现有映射

回答

相关问题