Dojo AMD:无法调用require中的函数

我真的是一个新手的dojo,但是当我开始使用dojo版本1.7.2开发一个新的应用程序,我也想使用新的AMD语法的功能.不幸的是,我似乎没有得到它. 🙁

最令我震惊的是,我不能简单地调用“require”-block内的任何函数.
例如,我有一个打开的页面创建一个动态表,每行中有几个小部件.
然后我有一个按钮,每次按下一个空行.

没有AMD语法会很容易:
– 把我所有的“dojo.require()”放在HEAD中
– 然后创建一堆我自己的功能来创建表和小部件
– 添加行函数可以轻松访问我以前的函数填充的任何全局变量

但与AMD一样:

初始函数创建表和小部件:

function fillReportTable(repId) {
require(["dojo/dom-construct", "dojo/dom-attr", "dijit/form/FilteringSelect",
"dojo/data/ItemFileReadStore", "dijit/form/ComboBox", "dijit/form/DateTextBox", "dijit/form/Select", "dojo/store/Memory"],
     function (domConstruct, domAttr, FilteringSelect, ItemFileReadStore, ComboBox, DateTextBox, Select, Memory) {
   // a lot of code to create the table, consisting of SEVERAL functions 
   function createNewRow(tbl) { ...} 
   function function1 () {... } 
   function function2 () {... } 
   function function3 () {... } 
}

现在“添加空行”按钮调用自己的函数“addEmptyRow”.
但在这个功能我必须:
– 再次对每个dojo模块执行其他要求
– 我不能使用“fillReportTable”功能中“内部”的任何功能.例如“createNewRow”功能

function addEmptyRow() {
require(["dojo/dom-construct", "dojo/dom-attr", "dijit/form/FilteringSelect",
"dojo/data/ItemFileReadStore", "dijit/form/ComboBox", "dijit/form/DateTextBox", "dijit/form/Select", "dojo/store/Memory"],
     function (domConstruct, domAttr, FilteringSelect, ItemFileReadStore, ComboBox, DateTextBox, Select, Memory) {
// a lot of code to create the table, consisting of SEVERAL functions
}

这似乎与AMD非常复杂.
还是我在这里缺少一些明显的东西?
使用AMD,如果将代码分离成很多小功能,那么你可以在每个功能中再次执行“require”吗?或者你把所有的功能放在一个“需要”的完整列表?
如果你这样做的第二种方式,你怎么能从窗口小部件事件调用这些功能?

最简单的方法是定义自己的模块.先看看这个教程:

http://dojotoolkit.org/documentation/tutorials/1.7/modules/

现在定义你自己的模块,例如“./js/mymodules/mymodule.js”(相对于HTML页面):

define([
    "dojo/dom-construct",
    "dojo/dom-attr",
    "dijit/form/FilteringSelect",
    "dojo/data/ItemFileReadStore",
    "dijit/form/ComboBox",
    "dijit/form/DateTextBox",
    "dijit/form/Select",
    "dojo/store/Memory"
], function (domConstruct, domAttr, FilteringSelect, ItemFileReadStore, ComboBox, DateTextBox, Select, Memory) {

    function fillReportTable(repId) {
       // a lot of code to create the table, consisting of SEVERAL functions 
       function createNewRow(tbl) { ...} 
       function function1 () {... } 
       function function2 () {... } 
       function function3 () {... } 
    }

    function addEmptyRow() {
       // a lot of code to create the table, consisting of SEVERAL functions
    }

    // Return an object that exposes two functions
    return {
        fillReportTable: fillReportTable,
        addEmptyRow: addEmptyRow
    }

});

并使用您的模块:

<html>

<head>

<script>
var dojoConfig = {
    baseUrl: "./js/",
    packages: [
        { name: "dojo", location: "lib/dojo" },
        { name: "dijit", location: "lib/dijit" },
        { name: "dojox", location: "lib/dojox" }
    ]
};
</script>

<script data-dojo-config="async: true" src="js/lib/dojo/dojo.js"></script>

</head>

...

<script>
require([
    "mymodules/mymodule"
], function (mymodule) {
    mymodule.fillReportTable(...);
    mymodule.addEmptyRow(...);
});
</script>
相关文章
相关标签/搜索