JavaScript
extjs portal 怎么动态增加小模块呢？
墨衍会员 · AI 创作全网分发 墨衍智能分发 通过墨衍一键同步至各平台 可同步平台 CSDN微信公众号微博知乎掘金百家号博客园抖音小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年，写一次发全网
我也要 关注 + 加入社区
var portpage1 = new Ext.Panel({
collapsible: true,
title: '第一页',
layout: {
type: 'border',
padding: '0 5 5 5'
},
items: [{
xtype: 'container',
region: 'center',
layout: 'border',
height: 500,
items: [{
id: 'app-portal1',
xtype: 'portalpanel',
region: 'center',
items: [{
id: 'col-1',
items: [{
id: 'app1id',
title: '应用1',
tools: this.getTools(),
items: [{
xtype: 'panel',
region: 'north',
items: [{
region: 'north',
height: 50,
border: false,
items: [{
xtype: 'button',
text: '管理1',
scale: 'small',
iconCls: 'add',
iconAlign: 'top'
}, {
xtype: 'button',
text: '管理2',
scale: 'small',
iconCls: 'add',
iconAlign: 'top'
}, {
xtype: 'button',
text: '管理3',
scale: 'small',
iconCls: 'add',
iconAlign: 'top'
}]
}, {
id: 'app1idcontent',
region: 'center',
height: 150,
html: content1()
}]
}],
height: 200,
listeners: {
'close': Ext.bind(onPortletClose, this)
}
}, {
id: 'app2id',
title: '应用2',
tools: this.getTools(),
items: [{
xtype: 'panel',
region: 'north',
items: [{
region: 'north',
height: 50,
border: false,
items: [{
xtype: 'button',
text: '管理1',
scale: 'small',
iconCls: 'add',
iconAlign: 'top'
}, {
xtype: 'button',
text: '管理2',
scale: 'small',
iconCls: 'add',
iconAlign: 'top'
}, {
xtype: 'button',
text: '管理3',
scale: 'small',
iconCls: 'add',
iconAlign: 'top'
}]
}, {
id: 'app2idcontent',
region: 'center',
height: 150,
html: content()
}]
}],
height: 200,
listeners: {
'close': Ext.bind(onPortletClose, this)
}
}]
}, {
id: 'col-2',
items: [{
id: 'app3id',
title: '应用3',
tools: this.getTools(),
items: [{
xtype: 'panel',
region: 'north',
items: [{
region: 'north',
height: 50,
border: false,
items: [{
xtype: 'button',
text: '管理1',
scale: 'small',
iconCls: 'add',
iconAlign: 'top'
}, {
xtype: 'button',
text: '管理2',
scale: 'small',
iconCls: 'add',
iconAlign: 'top'
}, {
xtype: 'button',
text: '管理3',
scale: 'small',
iconCls: 'add',
iconAlign: 'top'
}]
}, {
id: 'app3idcontent',
region: 'center',
height: 270,
autoScroll: true, //允许伸缩
html: contenttable()
}]
}],
height: 350,
listeners: {
'close': Ext.bind(onPortletClose, this)
}
}]
}, {
id: 'col-3',
items: [{
id: 'app4id',
title: '应用4',
tools: this.getTools(),
items: [{
xtype: 'panel',
region: 'north',
border: false,
items: [{
region: 'north',
height: 50,
items: [{
xtype: 'button',
text: '管理1',
scale: 'small',
iconCls: 'add',
iconAlign: 'top'
}, {
xtype: 'button',
text: '管理2',
scale: 'small',
iconCls: 'add',
iconAlign: 'top'
}, {
xtype: 'button',
text: '管理3',
scale: 'small',
iconCls: 'add',
iconAlign: 'top'
}]
}, {
id: 'app4idcontent',
region: 'center',
height: 120,
autoScroll: true, //允许伸缩
html: content1()
}]
}],
height: 200,
listeners: {
'close': Ext.bind(onPortletClose, this)
}
}]
}]
}]
}]
});
这样能初始化几个小窗体，如何动态的添加小模块呢
...全文
相关推荐
extjs portal 实例
一个参照examples中的portal 做的实例，实现了portal实例的随意拖拽，本身是需求动态改变布局的，但还没改好，先分享了
extjs portal组件代码
完美的个性化定制代码，下载下来后放到extjs2.0环境里就可以运行
Extjs portal 应用初探
NULL 博文链接：https://yiminghe.iteye.com/blog/338209
首页portal风格模板，基于extjs4.2
首页portal风格模板，基于extjs4.2,自定义面板可以在指定div容器内自由的 拖动，调整大小，在自定义面板的内部我们可以添加自己需要的内容
Portal2.zip
使用ext编写的仿window窗口的一个个性化portal组件示例。 初学者可以借鉴一下。 免积分啊
