javascript - 第一个选项卡面板不显示网格中的数据(IE 9)

标签 javascript extjs extjs4.2 extjs5

我有一个选项卡面板,每个选项卡中都有网格,但加载后,第一个选项卡中的数据丢失,但在第二个选项卡中显示正常,这在 Extjs 4.2 中的所有浏览器中都有效,但在 Extjs 4.2 中不起作用Extjs 5.0 与 IE。 (在 Chrome 中工作正常)控制台上没有错误。我对这个问题感到抓狂。可能是 Extjs 5 中的一个错误。提前致谢。

//main panel class

Ext.define('MyApp.view.MyView', {
  extend: 'Ext.tab.Panel',
  alias : 'widget.myView',
  id : 'myView',
  autoScroll : true,
  activeTab: 0,
  height: 600,

  layout: {
    type: 'column'
  },

  requires : [ 
    'MyView.view.FirstTab',
    'MyView.view.SecondTab'    
  ],

  initComponent : function() {

    this.items = [
      {  
       xtype: 'panel', 
       id: 'fTab',
       autoScroll: true, 
       items: [ { xtype: 'firstTab' }] 
      },
      {  
        xtype: 'panel', 
        id: 'sTab',
        autoScroll: true,
        items: [ { xtype: 'secondTab' } ] 
      }
  ];

    this.callParent(arguments);
  }
});

     //controller 

         var isActivieTabSet = false;

         // if store1 has data show the first tab
         if(store1Count > 0) {
            var tab0 = myView.down('#fTab');
            tab0.tab.show();
            if (!isActivieTabSet) {
              searchSummaryView.setActiveTab(tab0);
              isActivieTabSet = true;
            }          

          } else {
            myView.down('#fTab').tab.hide();
          }

          //check if store2 has data
          if(store2Count > 0) {
            var tab1 = myView.down('#sTab');
            tab1.tab.show();
            if (!isActivieTabSet) {
              myView.setActiveTab(tab1);
              isActivieTabSet = true;
            }
          } else {
            myView.down('#sTab').tab.hide();
          }

最佳答案

我发现您的代码存在以下问题:

  1. 您不应在选项卡面板上设置布局。选项卡面板在内部使用卡片布局,很可能它会忽略任何传递的布局,但如果您设置它,可能会让开发人员感到困惑
  2. 您在组件上设置了 id - 它们在您发布的代码中是唯一的,但对于整个应用程序来说可能并非如此。一般规则是不要手动设置 ids - 您不需要它们。
  3. 你过度嵌套 - 你不需要将“firstTab”包装在“fTab”中。我们总是尝试尽可能使用最浅的遏制链。
  4. 隐藏标签是非常不寻常的。我并不是说它不起作用,但如果您需要隐藏选项卡,那么您可以使用卡片布局和一些简单的切换逻辑。选项卡面板实际上是一个卡片布局,带有用于切换事件卡片的选项卡“按钮”。

否则代码不会给出为什么它会出现错误的线索。我建议 a) 修复上述问题,如果没有帮助 b) 在 https://fiddle.sencha.com 准备一个展示柜这样我就可以运行它并找到真正的罪魁祸首。

关于javascript - 第一个选项卡面板不显示网格中的数据(IE 9),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24396800/

相关文章:

javascript - 将 CSS 元素映射到 D3

javascript - extjs4 在按钮单击而不是鼠标悬停时显示工具提示

javascript - 可扩展属性设置为 true 并且没有子节点的树节点不会呈现加号图标

javascript - ExtJS 更改 MessageBox 中默认按钮的位置 (ExtJS 4.2.1)

javascript - 将数据添加到同一行的 2 列中,数据来自 Javascript Websocket

javascript - 如何阅读边界半径的实际 CSS 规则

javascript - CompositeField 上的自定义 FieldLabel

javascript - 如何在加载时根据条件隐藏 Ext 菜单中的项目

extjs - 缩小 ExtJs

javascript - 如何在 x 秒后自动重新加载页面并重新提交表单数据