extjs - 表单面板在 tabview 中不可见

Question

这是我在sencha中为我的应用程序编写的代码，我在resetpanel中包含了表格和两个按钮并添加到选项卡视图中

var tab= Ext.create('Ext.List', {
                       fullscreen: true,
                       dock: 'left',
                       width: 320,
                       height: 200,
                       ui: 'round',
                       store: {
                       fields: ['ext_xtype'],
                       data: [{
                              ext_xtype: 'fieldset',
                              }, {
                              ext_xtype: 'formpanel',
                              }]
                       }, 
                       itemTpl: '<span style="width:300px; display:inline-block;">{ext_xtype}</span> '
                       });
var resetPanel1  = new Ext.form.FormPanel({
                   id: 'resetPanel1',
                   style:{background:'#D8D8D8'},
                   dockedItems:[]
                   ,
                   items: [tab,{
                   xtype:  'button',
                   text:   'Add',
                   ui: 'confirm',
                   handler: function() {
                               view.setActiveItem('welcomepanel', {type:'fade', direction:'left'});
                                       }
                  },{
                   xtype:  'button',
                   text:   'Add',
                   ui: 'Search',
                  handler: function() {
                         view.setActiveItem('welcomepanel', {type:'fade', direction:'left'});
                                      }}]});
 var view = Ext.create('Ext.TabPanel', {
                                  fullscreen: true,
                                  tabBarPosition: 'bottom',
                                  scroll:'vertical',
                                  items: [{
                                          title: 'ITEMS',
                                          iconCls: 'star',
                                          layout:'card',
                                          items: [{
                                                  docked: 'top',
                                                  xtype: 'titlebar',
                                                  title: 'Add Items',
                                                  },resetPanel1
                                                  ]
                                          }]
                                  });
            Ext.Viewport.add(view);
 }
 });

resetPanel1 未在选项卡视图中查看。我的代码有什么问题。请帮我解决。

Answer 1

从列表中删除fullscreen和dock属性，你应该fullscreen : true只在主视图中，在你的情况下TabPanel。

var tab= Ext.create('Ext.List', {
     width: 320,
     height: 200,
     ui: 'round',
    store: {
      fields: ['ext_xtype'],
      data: [{
         ext_xtype: 'fieldset',
        },{
         ext_xtype: 'formpanel',
        }]
   }, 
  itemTpl: '<span style="width:300px; display:inline-block;">{ext_xtype}</span>'
});