extjs选项卡内容不会显示

时间:2011-12-13 22:59:59

标签: tabs extjs4 tabpanel

在下面的代码中,如果我将activeTab设置为0,则/ viewer / welcome的内容将按预期显示。如果我将activeTab设置为1(如下所示),则第二个选项卡会在加载时激活,但是当我单击第一个选项卡时,内容永远不会显示。我可以看到它加载选项卡的内容在我点击选项卡之前(如果我设置autoLoad:false,它根本不加载它),但即使它已加载,它也不会显示。

{
    xtype: 'tabpanel',
    activeTab: 1,
    items: [
        {
            xtype: 'panel',
            loader: {
                url: '/viewer/welcome/',
                renderer: 'html',
                autoLoad: true
            },
            layout: {
                type: 'fit'
            },
            title: 'Welcome'
        },
                    ...
       }

为什么激活标签时标签的内容实际上没有呈现?如果该选项卡是加载时的活动选项卡,为什么它可以工作,但是否则在激活它时不起作用?

如果我进行了这些更改,文本会按预期显示所有时间,但是我从虚假激活调用中获得额外的页面加载。

{
    xtype: 'tabpanel',
    activeTab: 1,
    items: [
        {
            xtype: 'panel',
            loader: {
                url: '/viewer/welcome/',
                renderer: 'html',
                autoLoad: false
            },
            layout: {
                type: 'fit'
            },
            title: 'Welcome',
            listeners: {
                activate: function(me, opts) {
                     me.getLoader().load();
                }
            }
        },
                    ...
       }

我只是不明白为什么这些标签不是作为标签的一部分来管理这些内容.....

2 个答案:

答案 0 :(得分:1)

我认为这里的问题就是您所说的 - 标签不是管理内容。他们没有正确管理它的原因是从加载器返回的HTML内容就是 - 一些HTML,它不是ExtJS组件。有争议的是,ExtJS“应该”管理它已加载的内容,但文档暗示相反:http://docs.sencha.com/ext-js/4-0/#!/api/Ext.Component-cfg-html在提交错误时可能是值得的。

另外,我注意到您在欢迎面板上指定了合适的布局。由于该面板中没有其他项目,因此您可能不需要该设置 - 顺便说一下,它可能(或可能不会)改进加载的html片段的处理方式。

祝你好运。

答案 1 :(得分:0)

我发现在ExtJS 5.1中使用引用名称不起作用。不得不放入一个itemId