加载所有requirejs模块后运行操作

Question

页面上有几个模块:

// module 1
require(['signalr'], function(s) {
    s.subscribe('myhub1', function () { /* some code */ });
});

// module 2
require(['signalr'], function(s) {
    s.subscribe('myhub2', function () { /* some code 2 */ });
});

并且在调用所有模块之后应该调用方法(所有订阅都已完成):

require(['signalr'], fuinction (s) { s.connect(); });

可能的解决方案是定义模块并按如下方式编写:

// module 1
define('module 1', ['signalr'], function(s) {
    s.subscribe('myhub1', function () { /* some code */ });
});

// module 2
define('module 2', ['signalr'], function(s) {
    s.subscribe('myhub2', function () { /* some code 2 */ });
});
require(['signalr', 'module 1', 'module 2'], fuinction (s) { s.connect(); });

但问题是不同的页面有不同的模块,比如说:

page1.cshtml:模块1

page2.cshtml:模块1,模块2

所以我不能写:require(['signalr','module 1','module 2'],fuinction(s){s.connect();}); 因为可能没有在page2.cshtml上定义模块2.

Answer 1

最好的方法是有条件地构建一个数组并将其传递给 require 函数，然后按照您在问题中提到的那样在回调中运行完成。

var modulesToLoad = [];

// Build the array

require(modulesToLoad, function (s) { 
    s.connect(); 
});

如果由于某种原因您无法将调用聚合到单个需求中，您将需要跟踪要加载的模块并在所有已加载的完成情况下运行检查，然后运行清理代码

var checkIfLoaded = {
    myhub1 : false,
    myhub2 : false,
    myhub3 : false
}

function checkIfReady(s) {
    for (var prop in checkIfLoaded) {
        if ( ! checkIfLoaded[prop] ) {
            return false;
        }
    }

    // Completion code
    s.connect();
}

require(['myhub1'], function(s) {
    checkIfLoaded.myhub1 = true;
    checkIfReady(s);
});

require(['myhub2'], function(s) {
    checkIfLoaded.myhub2 = true;
    checkIfReady(s);
});

考虑到这一点，您应该能够构建一个需求数组