Dojo 1.7 如何在 require() 之外使用 dojo 组件

我在 Dojo 1.7.2 中使用 AMD 加载程序创建了如下所示的 Dojo 小部件

var myCpane;

require([
            "dijit/layout/ContentPane"
        ], function(ContentPane) {
        myCpane = new ContentPane();
});

myCpane.startup();  // It gives 'myCpane' as undefined

在上面的示例中，在最后一条语句中，变量“myCpane”为“未定义”，如果我在“require()”回调函数中使用“myCpane.startup()”，那么它将正常工作。

但我想在“require”函数之外使用“myCpane”变量（出于很多原因）。我知道“require()”回调函数的执行由于 Dojo 的组件加载过程而延迟。

我的问题是，

1. 如何阻止“require()”函数，直到它完成执行其回调函数。

因此，当控件从“require()”函数中出来时，变量“myCpane”不会是“未定义”

=================================================== =========

为了解决这个问题，我编写了一个小函数来加载模块并等待模块加载完成

LoadModule: function(modulePath) { // modulePath = "dijit/layout/ContentPane" 
        var moduleObject = undefined; 

        require({async:  false}, [modulePath], function(getModuleObject) { 
                moduleObject = getModuleObject; 
        }); 

        // Wait until the module loads completes 
        while(moduleObject === undefined); 

        // Return the loaded module. 
        return moduleObject; 
} 

函数的输出始终执行 while 循环，控件永远不会进入“require() 的回调函数”以将值设置为变量“moduleObject”。

当“require()”函数调用它的回调函数时？我已经使用浏览器调试器窗口验证了文件“ContentPane.js”已正确加载，但未调用回调函数，如果我注释 while 循环，则会正确调用回调。

在我的例子中，控件何时进入回调函数内部？

我不确定你要实现什么目标，但它看起来像编程反模式 http://en.wikipedia.org/wiki/Anti-pattern#Programming_anti-patterns。无论如何你可以通过以下方式实现这一点dojo/_base/Deferred:

require(["dojo/_base/Deferred"], function(Deferred) {

    var deferred = new Deferred();

    require(["dijit/layout/ContentPane"], function(ContentPane) {
        var myCpane = new ContentPane();
        deferred.resolve(myCpane); //resolve, i.e. call `then` callback
    });

    deferred.then(function(myCpane) {
        console.log(myCpane);
        myCpane.startup();
    });

});​    

在 jsFiddle 上搞乱它：http://jsfiddle.net/phusick/HYQEd/ http://jsfiddle.net/phusick/HYQEd/

我还建议您考虑以下两种策略之一来实现相同的目标：

1. 给ContentPane an id并通过 dijit 获取其参考registry.byId().

2. Create ContentPane单独模块中的实例并将其公开为该模块的返回值：

   // file: myCpane.js
   define(["dijit/layout/ContentPane"], function(ContentPane) { 
       var myCpane = new ContentPane();
       return myCpane;
   });
   
   
   // file: main.js
   require(["./myCpane"], function(myCpane) {
       myCpane.startup();
   });