2

我有一个带有 3 个内容窗格的选项卡容器，仅在调整浏览器大小时才加载，但在实际页面加载期间不加载。模板文件 TContainer.html 如下

<div style="width:100%;height:100%" >
<div dojoType="dijit.layout.TabContainer" data-dojo-attach-point="tab" open="true" tabPosition="top" style="width:100%; margin:5px;font-weight:bold; overflow-y:visible;" tabStrip="true"  doLayout="false">

        <!-- content panes: title is tab name, make this tab selected -->
        <div dojoType="dijit.layout.ContentPane" style="width:100%;height:100%;"  data-dojo-props="title:'Tab1',selected:'true'">   

        </div>

        <!-- content panes: title is tab name, no special features here -->
        <div dojoType="dijit.layout.ContentPane" style="width:100%;height:100%;" data-dojo-props="title:'Tab2'">
        </div>

        <!-- content panes: title is tab name, make this tab closable -->
        <div dojoType="dijit.layout.ContentPane" style="width:100%;height:100%;"  data-dojo-props="title:'Tab3'">
            </div>

    </div>

小部件的关联 TContainer.js 文件如下

define([
"dojo/_base/declare",
"dojo/_base/fx",
"dojo/_base/lang",
"dojo/dom-style",
"dojo/mouse",
"dojo/on",
"dojo/query",
"dijit/layout/TabContainer", 
"dijit/layout/ContentPane",
"dijit/_WidgetBase",
"dijit/_TemplatedMixin",
"dijit/_WidgetsInTemplateMixin",
 "dojo/text!./templates/TabContainer.html"

], function(declare, baseFx, lang, domStyle, mouse, on,query,TabContainer,ContentPane,_WidgetBase, _TemplatedMixin,_WidgetsInTemplateMixin,template){ return declare( [_WidgetBase, _TemplatedMixin,_WidgetsInTemplateMixin], {

    templateString: template,

    c1:"content1",

    c2:"content2",

    c3:"content3",

    // A class to be applied to the root node in our template
    baseClass: "tabWidget",

    constructor: function (args) {
        // Allow pages variable to be set at runtime
        declare.safeMixin(this, args);

    },

    resize: function () { 
        this.tab.resize(arguments);
        this.inherited(arguments); 
    },

    postCreate: function(){

// Run any parent postCreate processes - can be done at any point
this.inherited(arguments);

},

});

});

我使用以下代码以编程方式创建小部件

var Tab = new TContainer({"c1" : "content1",     
                            "c2":"content2",
                             "c3":"content3 answers"
                           });
//dnode is a div node
Tab.placeAt(dnode);
Tab.startup();
Tab.resize();
4

2 回答 2

0

高度和宽度，而不是父容器的大小（此处必须是内容窗格）不会呈现为选项卡容器的大小，因此除非您手动调整浏览器大小或以编程方式强制调整大小功能，否则它将不起作用。

您也可以在启动后使用以下命令： resize: function () { this.parentCont.resize(arguments); //here parentCont is the widget attach point this.inherited(arguments); }

于 2015-02-26T11:03:06.343 回答
0

似乎需要在 tabcontainer 标记中定义 controllerWidget: 'dijit.layout.TabController' 属性。它现在可以正常工作，没有任何问题。感谢https://bugs.dojotoolkit.org/ticket/10113#comment:11

于 2015-03-12T23:18:12.300 回答