ExtJs5 -Ext.View.View 隐藏在 Ext 网格下方,仅在刷新后重新出现

ExtJs5 -Ext.View.View gets hidden beneath the Ext grid and only reappears after a refresh

我有一个使用 ExtJs5 呈现的页面。它有一个由 xtype:Container

组成的选项卡面板
 this.tabPanel = Ext.create('Ext.tab.Panel', {
        cls: 'tabPanel',
        width: '100%',
        minHeight: 400,
        activeTab: 0,
        items: [
            {
                title: 'Details',
                items: [
                    this.detailsPanel
                ]
            },
            {
                title: 'History',
                items: [
                    {
                        xtype: 'container',
                        layout: {
                            type: 'vbox',
                            align: 'stretch'
                        },
                        items: [
                            this.collectionHistoryTitle,
                            collectionHistoryChart,
                            this.horizontalLineTop,
                            this.collectionHistoryPanelView,

                            this.horizontalLineBottomMargin,
                            this.collectionHistoryGrid,
                            //this.collectionLogPaging,
                        ]
                    },
                    this.collectionHistoryDoNotChangeMessage
                ]

这里this.collectionHistoryPanelView,如下,

this.collectionHistoryPanelView = Ext.create('Ext.view.View', {
        store: 'collectionHistoryPanelStore',
        tpl: this.collectionHistoryPanelTpl,
        emptyText: 'Please select a row.',
        loadMask: false,
        margin: '0 0 10 0'

    });

发生的事情是,当我单击网格行 (this.collectionHistoryGrid) 时,空文本 ('Please select a row') 被 html 模板 (this.collectionHistoryPanelTpl) 替换,隐藏在网格后面并在刷新后正确显示。我已经尝试了很多东西,但到目前为止没有任何效果。

单击网格后,Ext 视图被隐藏:

刷新后有效:

@ardabeyazoglu 的评论给出了继续前进的正确道路。我们将 Ext 视图更改为容器,并将 html 模板作为 itemTpl,一切正常。

  this.collectionHistoryPanelView = Ext.create('Ext.container.Container', {

        margin: '0 0 10 0',
        items : [
                 {
                    xtype: 'dataview',
                    itemTpl: this.collectionHistoryPanelTpl,
                    store: 'collectionHistoryPanelStore',
                 }
                ],

    });