Sencha touch 不知道为什么我的子类控件没有出现

我正在尝试在应用程序中创建详细的行项目表单。我创建了Ext.Panel的一个子类，其中包含三个表单控件。然后我开始将该控件添加到我的可视面板中。只有一个人出现过。其他设置为0的高度。代码如下：

app.views.Forms.materialsLineItem = Ext.extend(Ext.Panel, {
    layout: {
        type: 'hbox',
        pack: 'center'
    },
    items: [
        new Ext.form.Spinner({
            width: 150
        }),
        new Ext.form.Text({
            placeHolder: 'Description',
            width: 400
        }),
        new Ext.form.Text({
            placeHolder: 'Price',
            width: 150
        })
    ]
});

app.views.Forms.Materials = new Ext.Panel({
    fullscreen: true,
    layout: {
        type: 'vbox',
        align: 'stretch'
    },
    items: [
        new app.views.Forms.materialsLineItem(),
        new app.views.Forms.materialsLineItem(),
        new app.views.Forms.materialsLineItem()
    ]
});

---

嗯，如果您使用如下对象文字声明表单组件，它会起作用：

app.views.Forms.materialsLineItem = Ext.extend(Ext.Panel, {
    layout: {
        type: 'hbox',
        pack: 'center'
    },
    items: [{
        xtype: 'spinnerfield',
        width: 150
    }, {
        xtype: 'textfield',
        placeHolder: 'Description',
        width: 400
    }, {
        xtype: 'textfield',
        placeHolder: 'Price',
        width: 150
    }]
});

我的猜测是，您的方法只创建了一次字段，sencha不允许您将同一组件添加到多个容器中，因此前两个面板中实际上没有任何内容

如果您查看Chrome的JavaScript控制台中的元素，您应该会看到前两个面板只是空div