extjs - Extjs 4.1 - 如何在网格面板中显示 html 数据

Question

我必须显示复杂的数据（我在表格上显示）并且我使用 xtemplate（我认为这是最好的方式）来显示它们

Ext.define('My.Example', {
    extend: 'Ext.Panel'
    , tbar:[{    
        text:'my button'
    }]
    ,tpl: '{data}'
});

但我需要在表格看起来像之后嵌入一个网格

|button|----|
|---table---|
|-----------|
|-----------|
|           |
|---grid----|
|-----------|

我该怎么办谢谢

Answer 1

使用盒子布局：

Ext.onReady(function() {

    new Ext.panel.Panel({
        width: 400,
        height: 400,
        renderTo: document.body,
        layout: {
            type: 'vbox',
            align: 'stretch'
        },
        tbar: [{
            text: 'Button'
        }],
        items: [{
            flex: 1,
            html: 'Top data'
        }, {
            flex: 1,
            xtype: 'gridpanel',
            store: {
                fields: ['name'],
                data: [{
                    name: 'Item 1'
                }]
            },
            columns: [{
                flex: 1,
                text: 'Name',
                dataIndex: 'name'
            }]
        }]
    });

});