Question

在一个文件中，我正在创建一个带有两个标签的标签面板。我正在尝试注册该组件以在单独的文件中使用。请考虑以下事项：

Ext.ns('DVI');

var backtestTab = {
    xtype: 'groupingstore'
}

var intradayTab = {
    xtype: 'groupingstore'
}

DVI.DviDashboard = new Ext.TabPanel({
    activeTab: 0,
    items: [backtestTab, intradayTab]
});

Ext.reg('dviDashboard', DVI.DviDashboard);

假设此页面正确填充了分组存储的选项卡。在调用此脚本的页面中，代码如下：

var dashboard = {
    xtype: 'tabpanel',
    id: 'port_dash-panel',
    activeTab: 0,
    items:[{
        title: 'Dashboard',
        xtype: 'dviDashboard'
    }]
 };

返回以下错误：

b[d.xtype || e] is not a constructor

经过研究，上述错误表明无法找到或未定义组件。

但请注意，以下代码可以正常工作并呈现tabpanel：

var dashboard = {
    xtype: 'tabpanel',
    id: 'port_dash-panel',
    activeTab: 0,
    items:[DVI.DviDashboard]
 };

我只是展示剪辑。仪表板选项卡面板在视口中呈现。

我想第一个问题是我是否可以通过这种方式注册组件？当然第二个问题是，为什么这不起作用？：）

Answer 1

您正在尝试注册无效的实例化对象。 Ext.reg通常接受由Ext.extend方法创建的组件。

DVI.DviDashboard = Ext.extend(Ext.TabPanel,{
    initComponent: function(){

    Ext.apply(this, {
        activeTab: 0,
        items: [backtestTab, intradayTab]
    });

    DVI.DviDashboard.superclass.initComponent.call(this)   
}
});

Ext.reg('dviDashboard', DVI.DviDashboard);

这是关于在Ext 3中编写类的一个古老但有用的链接：*： http://blog.extjs.eu/know-how/writing-a-big-application-in-ext/

ExtJS 3.2.1注册组件以与xtype一起使用

1 个答案: