extjs - 如何将第三方组件添加到 Ext.Tabpanel 中？

Question

我有一个CompFoo要添加到 Ext.Tabpanel 中的第 3 方组件，

HTML：

<div id="div1">
</div>
<div id="div2">
</div>

我将 CompFoo 渲染到 div2，将 tabpanel 渲染到 div1。

var Foo = new MacroHard.bar.box({
 ...
 renderTo: 'div2'
});

var tabs = Ext.createWidget('tabpanel',{
renderTo: 'input-div',
layout: 'fit',
height: '80%',
activeTab: 0,
items:[
       {
           title: 'User',
           items: [
            {
                id: 'userid-txtfld',
                xtype: 'textfield',
                fieldLabel: 'User ID',
                name: 'userid',
            },
           ]
       },
  ]....

我想要做的是将我的 CompFoo 放入选项卡之一。

两种方法：1）将具有给定 ID 的 div 创建到选项卡中，或 2）将 CompFoo 放入 TabPanel 的“项目”中。

我不知道如何以任何一种方式编写代码。

Answer 1

放入你的items:{}

new Ext.Panel({id: 'someID',title:'someTitle',hmtl:'<your html>',...})

没有测试，但应该可以工作

我更喜欢的另一种方法是使用loader:{url:<url to the site you want to show>,renderer:'frame',...}而不是html在面板中