Question

我是Dojo的新手。我试图创建一个具有以下结构的布局，其中我希望在其中一个内容窗格中生成数据网格。但控制台显示错误：

＆＃39; ＆＃34;在domReady回调＆＃34; ＆＃34; TypeError：undefined不是函数＆＃39;

任何人都可以关注此事。

<script>dojoConfig = {async: true, parseOnLoad: false}</script>

<script>
require(['dojo/parser', 'dijit/layout/BorderContainer', 'dijit/layout/ContentPane', 'dijit/layout/AccordionContainer', 'dijit/TitlePane', 'dijit/form/DropDownButton','dojo/_base/lang', 'dojox/grid/DataGrid', 'dojo/data/ItemFileWriteStore', 'dojo/dom', 'dojo/domReady!'],

 function(lang, DataGrid, ItemFileWriteStore, dom){

/*set up data store*/
var data = {
  identifier: "id",
  items: []
};
var data_list = [
  { col1: "normal", col2: false, col3: 'But are not followed by two hexadecimal', col4: 29.91},
  { col1: "important", col2: false, col3: 'Because a % sign always indicates', col4: 9.33},
  { col1: "important", col2: false, col3: 'Signs can be selectively', col4: 19.34}
];
var rows = 60;
for(var i = 0, l = data_list.length; i < rows; i++){
    data.items.push(lang.mixin({ id: i+1 }, data_list[i%l]));
}
var store = new ItemFileWriteStore({data: data});

/*set up layout*/
var layout = [[
  {'name': 'Column 1', 'field': 'id', 'width': '100px'},
  {'name': 'Column 2', 'field': 'col2', 'width': '100px'},
  {'name': 'Column 3', 'field': 'col3', 'width': '200px'},
  {'name': 'Column 4', 'field': 'col4', 'width': '150px'}
]];

/*create a new grid*/
var grid = new DataGrid({
    id: 'grid',
    store: store,
    structure: layout,
    rowSelector: '20px'});

    /*append the new grid to the div*/
    grid.placeAt("gridDiv");

    /*Call startup() to render the grid*/
    grid.startup();

}）;

<body class="soria">
<div data-dojo-type='dijit/layout/BorderContainer' style="width:100%; height:31px;">


<div data-dojo-attach-point="titleBar" class="dijitDialogTitleBar" title="My Dialog Title">
<span data-dojo-attach-point="titleNode" class="dijitDialogTitle" id="dialogOne_title">My Dialog Title</span>   
</div>




</div>


<div data-dojo-type='dijit/layout/BorderContainer' style="width:100%; height:60px;" >


<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'top'">
<div data-dojo-type="dijit/form/DropDownButton">
<span>Register</span>

<div class="buttonDropDown">
 <button data-dojo-type="dijit/form/Button" type="submit">Apply</button>
 <button data-dojo-type="dijit/form/Button" type="submit">Cancel</button>
 <button data-dojo-type="dijit/form/Button" type="submit">Save & Exit</button>
</div>

</div>  
</div>


</div>

<div data-dojo-type="dijit/layout/BorderContainer" style="width:100%;overflow:hidden; height:100%; background-color:#ccc;">

<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'leading'">

<div data-dojo-type="dijit/layout/AccordionContainer" style="width:300px;" class="Accordion">

<div data-dojo-type="dijit/layout/ContentPane" title="Folders"> 
</div>

<div data-dojo-type="dijit/layout/ContentPane" title="Search Messages"> 
</div>

<div data-dojo-type="dijit/layout/ContentPane" title="Contacts"> 
</div>

</div>

</div>

<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="region:'center'">


<div data-dojo-type="dijit/layout/BorderContainer"  id="rightBorderCon">

<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter: true, region: 'center'">

<div id="tp1" data-dojo-type="dijit/TitlePane" data-dojo-props="title:'Title Pane'" class="titlePane">

<p>Dojo is a JavaScript framework targeting the many needs of large-scale client-side web development. For example, Dojo abstracts the differences among diverse browsers to provide APIs that will work on all of them (it can even run on the server under Node.js); it establishes a framework for defining modules of code and managing their interdependencies; it provides build tools for optimizing JavaScript and CSS, generating documentation, and unit testing; it supports internationalization, localization, and accessibility; and it provides a rich suite of commonly needed utility classes and user-interface widgets.<p>

</div>


<div id="tp2" data-dojo-type="dijit/TitlePane" data-dojo-props="title:'Title Pane'" class="titlePane">

<p>Dojo is a JavaScript framework targeting the many needs of large-scale client-side web development. For example, Dojo abstracts the differences among diverse browsers to provide APIs that will work on all of them (it can even run on the server under Node.js); it establishes a framework for defining modules of code and managing their interdependencies; it provides build tools for optimizing JavaScript and CSS, generating documentation, and unit testing; it supports internationalization, localization, and accessibility; and it provides a rich suite of commonly needed utility classes and user-interface widgets.<p>

</div>


<div id="tp3" data-dojo-type="dijit/TitlePane" data-dojo-props="title:'Title Pane'" class="titlePane">

<p>Dojo is a JavaScript framework targeting the many needs of large-scale client-side web development. For example, Dojo abstracts the differences among diverse browsers to provide APIs that will work on all of them (it can even run on the server under Node.js); it establishes a framework for defining modules of code and managing their interdependencies; it provides build tools for optimizing JavaScript and CSS, generating documentation, and unit testing; it supports internationalization, localization, and accessibility; and it provides a rich suite of commonly needed utility classes and user-interface widgets.<p>

</div>


<div id="tp4" data-dojo-type="dijit/TitlePane" data-dojo-props="title:'Title Pane'" class="titlePane">

<p>Dojo is a JavaScript framework targeting the many needs of large-scale client-side web development. For example, Dojo abstracts the differences among diverse browsers to provide APIs that will work on all of them (it can even run on the server under Node.js); it establishes a framework for defining modules of code and managing their interdependencies; it provides build tools for optimizing JavaScript and CSS, generating documentation, and unit testing; it supports internationalization, localization, and accessibility; and it provides a rich suite of commonly needed utility classes and user-interface widgets.<p>

</div>
</div>

<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="splitter: true, region: 'bottom'" style="height:215px">
<div id="gridDiv"></div>
</div>


</div>

</div>




</div>
</body>

Answer 1

将您的要求声明更正为

require(['dojo/_base/lang', 'dojox/grid/DataGrid', 'dojo/data/ItemFileWriteStore', 'dojo/dom', 'dojo/parser', 'dijit/layout/BorderContainer', 'dijit/layout/ContentPane', 'dijit/layout/AccordionContainer', 'dijit/TitlePane', 'dijit/form/DropDownButton', 'dojo/domReady!'],    
 function(lang, DataGrid, ItemFileWriteStore, dom){.....

这个概念是第一个导入将被分配给第一个参数 - 'lang'，第二个导入到第二个 - 'DataGrid'等等。

你没有在任何地方解析..所以这段代码不会显示小部件。

domReady回调错误中的Dojo

1 个答案: