Extjs 在Ext.Define中创建xtype并在TabPanel项中调用它：[]

一般来说，我对extjs是新手，特别是对4版本：

我创建了一个类：

Ext.define('MyPanel', {
    extend:'Ext.panel.Panel',
    views: ["MyPanel"],

    config: {
        width: 200,
        height: 300,
        title: "HELLO"
    },

    constructor:function(config) {
        this.initConfig(config);
        return this;
    },
    alias: 'widget.MyPanel'
});

接下来，我想在tabPanel items:[]：
我喜欢这样：

items: [{
    title: 'Kontakt',
    id: 'kontaktTab',
    closable:true,
    closeAction: 'hide',
    layout: 'fit',
    items:[{
            xtype: "MyPanel"
        }]

...
items : [panel1 ]
...

还不走运，我得到的只是：

无法创建无法识别的别名的实例：widget.MyPanel“

你一定会想，真是个傻瓜。。。。 ；-）

---

有人请帮忙！！！

Hrm，你试过将别名小写吗。我以为别名总是以小写形式存储和获取的，但不确定当你定义视图（MyPanel）时，为什么要设置

视图

属性

Ext.define('MyPanel', {
    extend:'Ext.panel.Panel',
    alias: 'widget.MyPanel'
    views: ["MyPanel"],    <------ Why do you need this???
    config: {
        width: 200,
        height: 300,
        title: "HELLO"
    },
    constructor:function(config) {
        this.initConfig(config);
        return this;
    }
});

---

啊，呵呵，我完全忽略了一件事：

使用“别名”，您将在ExtJS类列表中创建一个新的类引用

var newMyPanel = Ext.create('widget.MyPanel');

但是，如果要添加带有xtype说明符的实例，则必须省略小部件部分，只需执行以下操作：

var myContainer = Ext.create('Ext.panel.Panel',{
    items: [{
        xtype: 'MyPanel'
    }]
});

使用上述代码，Ext将查找别名为“widget.MyPanel”的类

除此之外，我认为您的构造函数看起来有点怪。构造函数不应该返回自身（就像您在Perl构造函数中所做的那样）

这就足够了：

constructor: function() {
     this.callParent(arguments);
     // Your own code here
}

干杯，如果有帮助请告诉我

---

Rob

你所要做的就是这样声明：

 var panel1 =  Ext.create('Ext.app.myPanel',{title : 'panel 1',height:350});//title and hight are optionals if u have already defined them

然后像这样使用它：

items: [{
    title: 'Kontakt',
    id: 'kontaktTab',
    closable:true,
    closeAction: 'hide',
    layout: 'fit',
    items:[{
            xtype: "MyPanel"
        }]

...
items : [panel1 ]
...

您可能需要：

 Ext.require([
, 'Ext.app.myPanel'
]);

并将mypanel.js放入应用程序文件夹

---

希望这有帮助

是的，我做了，也没有运气！我可以确认-这是一个正确的答案，它对我有效，Ext JS确实不允许视图名称中的大写字母。