请教Ext达人Viewport中toolbar和gird布局的问题

为什么在Viewport center加一个gird, north部分的toolbar中的buttongroup样式就变了。
Demo代码:
[code="js"]
Ext.onReady(function() {
MyViewportUi = Ext.extend(Ext.Viewport, {
layout: 'border',
initComponent: function() {
this.items = [
{
xtype: 'panel',
title: 'My Panel',
region: 'center',
width: 100,
layout: 'fit',
items: [
{
xtype: 'grid',
title: 'My Grid',
columns: [
{
xtype: 'gridcolumn',
dataIndex: 'string',
header: 'Column',
sortable: true,
width: 100
},
{
xtype: 'numbercolumn',
dataIndex: 'number',
header: 'Column',
sortable: true,
width: 100,
align: 'right'
},
{
xtype: 'datecolumn',
dataIndex: 'date',
header: 'Column',
sortable: true,
width: 100
},
{
xtype: 'booleancolumn',
dataIndex: 'bool',
header: 'Column',
sortable: true,
width: 100
}
]
}
]
},
{
xtype: 'treepanel',
title: 'My Tree',
region: 'west',
minWidth: 200,
width: 200,
margins: '5 5 5 0',
collapsible: true,
root: {
text: 'Multiple-choice'
},
loader: {

                }
            },
            {
                xtype: 'container',
                region: 'north',
                width: 100,
                minHeight: 80,
                height: 80,
                items: [
                    {
                        xtype: 'toolbar',
                        items: [
                            {
                                xtype: 'buttongroup',
                                title: 'New',
                                columns: 2,
                                titleCollapse: true,
                                items: [
                                    {
                                        xtype: 'button',
                                        text: 'Question',
                                        arrowAlign: 'bottom',
                                        menu: {
                                            xtype: 'menu',
                                            items: [
                                                {
                                                    xtype: 'menuitem',
                                                    text: 'Menu Item'
                                                }
                                            ]
                                        }
                                    }
                                ]
                            },
                            {
                                xtype: 'buttongroup',
                                title: 'Settings',
                                columns: 2,
                                items: [
                                    {
                                        xtype: 'button',
                                        text: 'Quiz Properties',
                                        width: 30
                                    },
                                    {
                                        xtype: 'button',
                                        text: 'Player Template'
                                    }
                                ]
                            },
                            {
                                xtype: 'buttongroup',
                                title: 'Publish',
                                columns: 2,
                                items: [
                                    {
                                        xtype: 'button',
                                        text: 'Preview'
                                    },
                                    {
                                        xtype: 'button',
                                        text: 'Publish'
                                    }
                                ]
                            }
                        ]
                    }
                ]
            },
            {
                xtype: 'container',
                region: 'south',
                width: 100,
                height: 30,
                minHeight: 30
            }
        ];
        MyViewportUi.superclass.initComponent.call(this);
    }

});

var ui = new MyViewportUi();

});
[/code]

请赐教! :D

2个回答

因为你的表格的ds为空 设置一下表格的ds属性就可以了

当结果出不来的时候 看看火狐的错误控制台 对你很有帮助的

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问