道场stackContainer没有显示孩子，直到窗口大小调整(Dojo stackContaine

这是我试图创建窗口小部件。我们的目标是在顶部的单选按钮控制在StackContainer。

我曾尝试道场文档中的例子，但它具有相同的错误行为。

define(["dojo/ready",  "dojo/_base/declare", "dijit/_WidgetBase", "dojo/dom-construct", 
        "dojo/_base/lang", "dojo/on", "dojo/dom-attr", "dijit/form/RadioButton", 
        "dojo/dom-style", "dijit/layout/ContentPane", "dijit/layout/StackContainer", 
        "tcs/Log"], 
function(ready, declare, _WidgetBase, domConstruct, 
         lang, on, attr, RadioButton, 
         style, ContentPane, StackContainer, 
         log) {

    /**
     * @class
     * @name gijit.workflow.debug.combi
     */
    return declare("gijit.workflow.debug.combi", [_WidgetBase], {
        workflow : null,
        panes : null,
        width : "600px",
        height : "400px",

        _beforeCall : function(d) {
            alert("beforeCall");
        },

        buildRendering : function() {
            this.domNode = domConstruct.create("div", {id:"myform"});
            var contain = domConstruct.create("div", null, this.domNode, "last");
            var stackContainer = new StackContainer({
                style: "height: " + this.height + "; width: " + this.width + "; border: 0px solid red"
            }, contain);
            var buttons = domConstruct.create("form", null, this.domNode, "first");
            for(var i=0; i<this.panes.length; i++){
                var contentPane = new ContentPane({
                    id : this.panes[i].title,
                    title : this.panes[i].title,
                    content : this.panes[i].content
                })
                stackContainer.addChild(contentPane);

                var buttonDiv = domConstruct.create("span", null, buttons, "last");
                style.set(buttonDiv, "display", "inline-block");
                style.set(buttonDiv, "margin", "10px");

                var label = domConstruct.create("div", {innerHTML: this.panes[i].title}, buttonDiv, "last");

                if(i==0){
                    var RButton = new RadioButton({
                        title : this.panes[i].title,
                        showTitle : true,
                        checked : true,
                        value : this.panes[i].title, 
                        name : "options",
                        onClick : function(a){stackContainer.selectChild(a.explicitOriginalTarget.attributes.value.textContent)}
                    }).placeAt(buttonDiv);
                } else {
                    var RButton = new RadioButton({
                        title : this.panes[i].title,
                        showTitle : true,
                        checked : false,
                        value : this.panes[i].title,
                        name : "options",
                        onClick : function(a){stackContainer.selectChild(a.explicitOriginalTarget.attributes.value.textContent)}
                    }).placeAt(buttonDiv);
                }
                contentPane.resize();
                contentPane.startup();
            }
            stackContainer.startup();
                    //Hacks in attempt to get the stuff to show
            for(var i=0; i<stackContainer.getChildren().length; i++){
                stackContainer.getChildren()[i].startup();
                stackContainer.getChildren()[i].resize();
                if(typeof stackContainer.getChildren()[i].getChildren()[0] === 'object'){
                    stackContainer.getChildren()[i].getChildren()[0].startup(); 
                }
            }
            stackContainer.resize();
        },
    });
});

在大多数情况下，它的工作原理。但为了得到任何东西，以显示我必须调整窗口的大小。加入所有reisizing /启动来电之后它最初没有工作，但他们没有做任何事情。

Answer 1:

如果以编程方式添加子部件到你的widget，你需要定义一个启动子控件启动功能。只要创建一个新的实例，并放置在DOM，在启动功能，那么应该叫。例如：

require(["dojo/ready", "dojo/_base/declare", "dijit/_WidgetBase", "dojo/dom-construct",
  "dojo/_base/lang", "dojo/on", "dojo/dom-attr", "dijit/form/RadioButton",
  "dojo/dom-style", "dijit/layout/ContentPane", "dijit/layout/StackContainer"],

function (ready, declare, _WidgetBase, domConstruct,
lang, on, attr, RadioButton,
style, ContentPane, StackContainer) {


  var MyClass = declare("gijit.workflow.debug.combi", [_WidgetBase], {
    startup: function () {
      this.inherited(arguments);
      stackContainer.startup();
    }
  });
  var x = new MyClass({});
  x.placeAt('node');
//manually call startup after instantiating the widget.  If  the parser is what is creating your widget, it calls startup automatically.  startup must be called after the widget is in the dom.
  x.startup();
  console.log(x);
});

Answer 2:

制作的contentPane而不是_WidgetBase的窗口小部件的子类来解决这个问题，因为ContentPanes知道如何调整自己

又见子控件就无法显示（将0的高度）在道场