Java Extjs-在边框布局中将数据加载到中心区域

我是ExtJS新手，正在尝试使用边框布局。 我似乎找不到将ext组件加载到中心区域的方法

所有内容都包含在视口中：

new Ext.Viewport({
    layout: 'border',
    items: [

我在西部地区设置了这样一个树面板：

xtype: 'panel',
region: 'west',
width: 200,
items: [{
    xtype: 'treepanel',
    height: 500,
    border: false,
    autoScroll: true,
    width: 199,
    autoWidth: true,
    id: 'navtree',
    root: new Ext.tree.AsyncTreeNode({
        expanded: true,
        children: [{
            text: 'Users',
            expanded: false,
            children: [{
                id: 'adduser',
                text: 'Add User',
                leaf: true,
        },{
        id: 'deleteuser',
        text: 'Delete User',
        leaf: true

等等。。。。。 导航树显示正确

中心区域设置为：

{
xtype: 'panel',
region: 'center',
autoScroll: true,
contentEl: 'centercontents'
}

我最初加载的外部网页如下所示：

Ext.getCmp('navtree').on('click', function(node){
  if(node.id == 'adduser'){Ext.get("centercontents").load({ url: "/adduser" });}

“centercontents”是主html文件中的一个div

这也很好，但现在我想扩展它，以便 单击“添加用户”节点，将表单显示到中心区域 直接。。。绕过加载任何类型的附加html文件

任何指向正确方向的指示都将不胜感激。

---

（示例代码更好）

在这方面取得了进展，但出现了一个新问题

我已将中心区域更改为：

{
xtype: 'panel',
region: 'center',
autoScroll: true,
id: 'centercontents'
}

并将单击更改为：

Ext.getCmp('navtree').on('click', function(node){
    if(node.id == 'adduser')
        {
        var content = Ext.getCmp('centercontents');
        content.removeAll(true);
        var container = content.add(simpleadduser);
        content.doLayout();
        container.show();
        }

其中SimpleReadDuser是一个表单

页面加载时，导航树将正确显示，并单击adduser 节点将表单加载到中心请求中。但是，单击adduser 节点第二次使窗体消失。有没有理由不重新加载

---

本身？

您可能正在创建该表单对象的新实例。当发生上述情况时，将为

addsimpleuser

对象创建一个重复的DOM ID。这种碰撞很可能是导致窗体不显示的原因

---

在创建对象之前，只需简单检查该对象是否存在，即可解决问题。

尝试删除以下行：

content.removeAll（true）