邊界容器不能在dojo中工作

我正在嘗試dojo中bordercontainer的基本示例，下面是它的html代碼，但它不顯示所需的輸出。任何人都可以告訴我我在這裏做錯了什麼。這個示例代碼我只從dojo教程中獲得，並且我在firebug中也沒有收到任何錯誤。邊界容器不能在dojo中工作

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>ICN Layout</title> 

</head> 
<body> 
    <!-- load Dojo --> 
    <script>dojoConfig = {parseOnLoad: true}</script> 
    <script src="dojo/dojo.js"> 
    </script> 
    <script> 
    require([ 
    "dijit/layout/BorderContainer", "dijit/layout/ContentPane", 
    "dojo/domReady!" 
    ], function(BorderContainer, ContentPane){ 
    // create a BorderContainer as the top widget in the hierarchy 
    var bc = new BorderContainer({ 
    style: "height: 300px; width: 500px;" 
    }); 

    // create a ContentPane as the left pane in the BorderContainer 
    var cp1 = new ContentPane({ 
    region: "left", 
    style: "width: 100px", 
    content: "hello world" 
    }); 
    bc.addChild(cp1); 

    // create a ContentPane as the center pane in the BorderContainer 
    var cp2 = new ContentPane({ 
    region: "center", 
    content: "how are you?" 
    }); 
    bc.addChild(cp2); 

    // put the top level widget into the document, and then call startup() 
    bc.placeAt(document.body); 
    bc.startup(); 
    }); 
    </script> 
</body> 
</html>

來源

2015-06-08 Gaurav Parek

我不知道，如果你的道場/的dojo.js文件加載正確的，但我沒有看到你的代碼所需要的道場css文件。確保包含這些（基於您使用的主題）。例如：

<link rel='stylesheet' href='http://ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/resources/dojo.css'> 

<link rel='stylesheet' href='http://ajax.googleapis.com/ajax/libs/dojo/1.10.4/dijit/themes/claro/claro.css'>

這裏有兩個工作的例子，說明你的代碼工作：

筆：http://codepen.io/kyledodge/pen/RPVjgY

小提琴：http://jsfiddle.net/6v0x0jue/2/

來源

2015-06-08 06:03:49

dojo.js文件正在正確加載，但是關於dojo.css文件是否必須包含該文件？我們不能僅僅通過包含dojo.js來編寫代碼嗎？ –

是的，你需要包含這些CSS文件才能正確渲染。這裏是沒有CSS的情況下的例子：http://jsfiddle.net/m2j72unh/1/注意到這個css文件在這個小提琴中被註釋掉了。 –

@GauravParek正如所提到的，你需要包含主題（claro.css）文件。您還需要爲body標籤添加'class =「claro」'屬性，即'dojo小部件才能正確呈現 – frank

你有正確下載，並把所有必需的道場的dijit dojox文件夾？然後，您可以包括本地的CSS：

<link rel="stylesheet" href="dijit/themes/claro/claro.css" media="screen"> 
<link rel="stylesheet" href="dojo/resources/dojo.css">

我看到代碼工作沒有任何問題，如果你添加以下代碼：

// create a ContentPane as the Top pane in the BorderContainer 
    var cp0 = new ContentPane({ 
     region: "top", 
     content: "This is The Top!" 
    }); 
    bc.addChild(cp0);

你可以看到CP0的contentPane被放置在頂部沒有任何問題... 我想你想看到邊界（也許背景顏色）來可視化該區域？

來源

2015-06-10 04:39:28

邊界容器不能在dojo中工作

回答

相關問題