javascript - extjs 门户示例中的动态列

Question

extjs 门户示例中的动态列。

我想在 extjs 门户示例中动态插入列——特别是我想嵌套它们，问题是我能够动态添加列但不能在其中删除 portlet，但是如果我手动嵌套列(即如果它们已经存在并且未在运行时定义)那么一切正常，即我能够将 portlet 放入其中。

有人能帮忙吗？

这里是一些相关的代码:

基本声明:

Ext.define('Ext.app.Portal', {
id: 'parentPortal',
    extend: 'Ext.container.Viewport',
    requires: ['Ext.app.PortalPanel', 'Ext.app.PortalColumn', 'Ext.app.GridPortlet', 'Ext.app.ChartPortlet'],
initComponent: function(){
    items: [{                        
                        xtype: 'portalpanel',
                        id:'threecolumn',
                        region: 'center',                        
                        items: [{
                            id: 'col-1',
                            width: 200,
                            childAnchor: '50% 50%' ,
                            items: [
                                {
                                    xtype: 'portalpanel',
                                    items: [
                                        {
                                            id: 'col-4',
                                            minHeight:200
                                        }

                                    ],                                    
                                }
                            ]
                        },{
                            id: 'col-2',
                            items: [
                                {
                                    xtype: 'portalpanel',
                                    items: [
                                        {
                                            id: 'col-5',
                                            minHeight:200
                                        }

                                    ],                                    
                                }
                            ]
                        },{
                            id: 'col-3'
                        }]
                    }]
}
}

动态列:

Ext.create('Ext.app.PortalPanel', {            
              xtype: 'portalpanel',              
        });
}

Answer 1

请添加监听器

listeners: {
                render: function() {
                    var panel = this;
                    setTimeout( function() {
                    var parent = panel.up('portalpanel');
                    var bb = Ext.ComponentQuery.query('#threecolumn')[0]
                    console.log( bb == parent );
                    parent.dd.unreg();
                    parent.dd = Ext.create('Ext.app.PortalDropZone', parent, parent.dropConfig);
                    bb.dd.unreg();
                    bb.dd = Ext.create('Ext.app.PortalDropZone', bb, bb.dropConfig);        
                    console.log(panel);
                    console.log(parent);
                    }, 500);                        
                }
              }