在Ext.form.Panel中显示组件

Displaying components in Ext.form.Panel

本文关键字：显示 组件 Panel Ext form      更新时间：2023-09-26

我有一个自定义组件(一个网格)，我想添加到面板上，然后在顶部有一个组件带。

网上所有的例子都是这样的:

var extPanel = Ext.create('Ext.form.Panel', {
    items: [{
        fieldLabel: 'Send To',
        name: 'to',
        anchor:'100%' 
    },{
        fieldLabel: 'Subject',
        name: 'subject',
        anchor: '100%' 
    },

我想添加我自己的自定义组件，称为myGrid。我希望有一些属性叫做组件传入项目，但我不知道，因为没有关于这个"项目"数组可以是什么的文档。

var extPanel = Ext.create('Ext.form.Panel', {
    items: [{
        component : myGrid   
        anchor:'100%'  // anchor width by percentage
    }

您可以使用xtype显式地创建已定义的组件。你可以参考这个文件:Demo

我通过在项中嵌套项来解决这个问题，像这样:

        this.packageGrid = Ext.create('js.grid.PackageGrid', {
            xtype: 'packageGrid',
//            title: 'Packages',
            width: '100%'
        });
        var extPanel = Ext.create('Ext.Panel', {
            layout:'border',
            bodyPadding: 5,
            items:[{
                region:'center'
                ,layout:'fit'
                ,border:false,
                items:[
                    this.packageGrid
                ]
            },{
                region:'north'
                ,layout:'fit'
                ,border:false
                ,height:50
                ,collapsible:false,
                items:[
                    button
                ]
            }],
            width: '979px',
            height: '400px'
        });
相关文章：