Extjs 在2个面板中添加1个容器

是否可以在两个不同的面板中添加一个容器？我试过这样做

var container =  Ext.create('Ext.container.Container', {
    //container content
});

var panel1 = Ext.create('Ext.form.Panel', {
    //panel1 content
    items : [container]
});

var panel2 = Ext.create('Ext.form.Panel', {
    //panel2 content
    items : [container]
});

但它只在第二个面板中添加容器

---

这是一个

它取决于您的用例。 如果您觉得可以渲染容器两次，只需将容器的配置传递给面板即可：

var container = {
    //container content
    items: {
        xtype: 'displayfield',
        value: 'container content'
    }
};

var panel1 = Ext.create('Ext.form.Panel', {
    //panel1 content
    renderTo: Ext.getBody(),
    title: 'panel1',
    items: container
});

var panel2 = Ext.create('Ext.form.Panel', {
    //panel2 content
     renderTo: Ext.getBody(),
    title: 'panel2',
    items: container
});

对于重用实例并将同一实例放在dom中的不同位置上两次，我看不出有任何方法可以实现这一点。我甚至认为这根本不可行，但也许其他人可以教我如何以干净舒适的方式来做；）

---

在两个面板上渲染容器

这个小代码看起来是正确的。但是你能在小提琴上显示同样的东西吗？我可以在那里检查。@Tejas1991:这是我试图制作的程序的最新版本。正如你所见，容器只添加到第二个面板中，我刚刚调试了你的问题并修复了它，它将在几分钟内作为答案发布。

var container = {

    items: [{
        xtype: 'button',
        text : 'select',
         handler: function() {
            alert(this.up('form').getTitle()+ " clicked");
        }
    }]
};

var panel1 = Ext.create('Ext.form.Panel', {
    //panel1 content
    renderTo: Ext.getBody(),
    title: 'panel1',
    items: container
});

var panel2 = Ext.create('Ext.form.Panel', {
    //panel2 content
     renderTo: Ext.getBody(),
    title: 'panel2',
    items: container
});