0

Dojo のTabContainer内でBorderContainerを使用する必要があります 。私の要件は、作成する各タブ内に 3 つの異なるペインを持つことです。そのため、TabContainer 内で BorderContainer を使用しようとしていますが、機能していないようです。これが私が試みていることです。

A、B、および C は、作成しようとしているタブです。その内部では、それぞれにContentPaneを使用し、次に BorderContainer を使用して、その特定のタブの左、中央、および右の領域を指定しています。

しかし、それは私に何の出力も与えていません。ここで私が間違っていることを教えてください。

 <div data-dojo-type="dijit/layout/TabContainer" data-dojo-props="splitter:true, region:'top'">
            <div data-dojo-type="dijit/layout/ContentPane" title="A" selected="true" data-dojo-props="splitter:true">
              <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="guuers:false">
                 <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true,region:'left'">Left pane of Tab A</div>
                 <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true,region:'center'">Center pane of Tab A</div>
                 <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true,region:'right'">Right pane of Tab A</div>
              </div>
            </div>
            <div data-dojo-type="dijit/layout/ContentPane" title="B" data-dojo-props="splitter:true">
              <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="guuers:false">
                 <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true,region:'left'">Left pane of Tab B</div>
                 <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true,region:'center'">Center pane of Tab B</div>
                 <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true,region:'right'">Right pane of Tab B</div>
              </div>
            </div>
           <div data-dojo-type="dijit/layout/ContentPane" title="C" selected="true" data-dojo-props="splitter:true">
              <div data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="guuers:false">
                 <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true,region:'left'">Left pane of Tab C</div>
                 <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true,region:'center'">Center pane of Tab C</div>
                 <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter:true,region:'right'">Right pane of Tab C</div>
              </div>
            </div>
   </div>
4

2 に答える 2

1

あなたの宣言マークアップは正しいですが、コードの残りの部分が見えないので、TabContainer、BorderContainer、および ContentPane で require を呼び出していないと思います。Dojo では、あなたが行っているように宣言的に使用する前に、それらを取り込む必要があります。したがって、JavaScriptでこれが必要になります。

require([
  "dojo/parser",
  "dijit/layout/BorderContainer",
  "dijit/layout/TabContainer",
  "dijit/layout/ContentPane"
]);

これはあなたのコードが機能することを示すペンです。そのため、require を使用してそれらのモジュールをプルしているかどうかを確認します。 http://codepen.io/kyledodge/pen/MwpMZm

他にチェックすべきことは、dojoConfig が parseOnLoad に設定されているかどうかです。

dojoConfig = {
  parseOnLoad: true
};

そうでない場合は、それを設定するか、dojo/parser を要求して parser.parse() を呼び出す必要があります。パーサーは、あなたが行っているように data-dojo-type 属性を使用するための鍵です。役立つ情報を次に示します。

http://dojotoolkit.org/reference-guide/1.10/dojo/parser.html

于 2015-06-05T06:41:08.207 に答える
0

正確な答えはありませんが、何も表示されない理由を正確に突き止めることができると思います。境界コンテナーは、含まれているオブジェクトを「満たしていないようです」。ボーダー コンテナーを別のボーダー コンテナー内に配置しようとしています。その子ノードは存在しますが、高さがゼロになるようです。どうやら、境界コンテナーの寸法を明示的に設定する必要があるようです。

于 2016-05-27T21:29:41.120 に答える