如何解决将元素添加到轮播sencha
| 在sencha touch中,我有一个这样的轮播声明:ajaxNav = new Ext.Panel({
scroll: \'vertical\',cls: \'card1 demo-data\',styleHtmlContent: true,layout: {
type: \'vbox\',align: \'stretch\'
},defaults: {
flex: 1
},items: [{
xtype: \'carousel\',items: [{
id:\'tab-1\',html: \'\',cls: \'card card1\'
},{
id:\'tab-2\',html: \'<p>Clicking on either side of the indicators below</p>\',cls: \'card card2\'
},{
id:\'tab-3\',html: \'Card #3\',cls: \'card card3\'
}]
}]
});
有人知道如何动态添加元素吗?
解决方法
我为您编写了一个简单的示例,向您展示如何在现有Ext.Carousel元素上动态添加新面板。
Ext.setup({
onReady: function() {
var ajaxNav = new Ext.Carousel({
fullscreen: true,dockedItems: {
xtype: \'toolbar\',title: \'Demo\',items: [{
xtype: \'button\',ui: \'action\',text: \'Add\',handler: function(){
var element = new Ext.Panel({
html: \'New Element\'
});
ajaxNav.add(element);
ajaxNav.doLayout();
}
}]
},items: [{
id:\'tab-1\',html: \'\',cls: \'card card1\'
},{
id:\'tab-2\',html: \'<p>Clicking on either side of the indicators below</p>\',cls: \'card card2\'
},{
id:\'tab-3\',html: \'Card #3\',cls: \'card card3\'
}]
});
}
});
如您所见,在“添加”按钮事件上,您首先必须根据需要定义面板,然后将其添加到轮播中,最重要的是,您必须让轮播重新计算其布局调用\“ doLayout()\”函数。
希望这可以帮助。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。