2017-11-24 2 views
1

モジュールを動的にインポートしようとしました。選択するモジュールは、いくつかの条件(この例ではランダムモードを使用した場合)に依存する必要があります。RequireJS動的ロードモジュールをインポートせずにすべてのモジュール

が必要-conf.js

requirejs.config({ 
    paths: {     
     'test': 'test/' 

    } 
}); 

テスト/ chart.js

define([], function() { 

    function Chart(id, data) {  
    if (!(this instanceof Chart)) { 
     throw new TypeError("Chart constructor cannot be called as a function."); 
    } 
    console.log("chart"); 
    }; 

    return (Chart); 
}); 

テスト/ chart2.js

define([], function() { 

    function Chart2(id, data) {  
    if (!(this instanceof Chart2)) { 
     throw new TypeError("Chart constructor cannot be called as a function."); 
    } 
    console.log("chart2"); 
    }; 

    return (Chart2); 
}); 

オプション1

このオプションは動作しますが、両方のスクリプトをインポートする必要があります。だから、それは最適ではありません。

require(['test/chart','test/chart2'], function() { 
    var id = Math.floor(Math.random() * 2); 
    var modules = ['chart','chart2']; 
    var chart = require('test/' + modules[id]); 
    console.log(chart); 
}); 

出力: チャート()またはChart2()

オプション2

このオプションは、非同期です。モジュールをロードする前にオブジェクトを印刷します。

require([], function() { 
    var chart = null; 
    var id = Math.floor(Math.random() * 2); 
    var modules = ['chart','chart2']; 
    require(['test/' + modules[id]], function (Chart) { 
     chart = new Chart(); 
    }); 
    console.log(chart); 
}); 

出力: ヌル

オプション3

このオプションは、ロード・エラーを生成します。

require([], function() { 
    var id = Math.floor(Math.random() * 2); 
    var modules = ['chart','chart2']; 
    var chart = require('test/' + modules[id]); 
    console.log(chart); 
}); 

出力: エラー

動的にモジュールをロードするための適切な方法で私を助けてください。

答えて

0

RequireJSfunction

var id = Math.floor(Math.random() * 2); 
var modules = ['chart','chart2']; 

require(['test/' + modules[id]], function (Chart) { 
    var chart = new Chart(); 

    myLogic(chart); // call function and pass "chart" 
}); 


function myLogic(chart) { 
    console.log(chart); // add your logic here 
} 
を使用し、あなたが requireコールバックの外のロジックを持っているしたい場合は、これはあなたの唯一のオプション

var id = Math.floor(Math.random() * 2); 
var modules = ['chart','chart2']; 

require(['test/' + modules[id]], function (Chart) { 
    var chart = new Chart(); 

    console.log(chart); // add your logic here 
}); 

で、モジュールがロードされ、以前だった場合を除いて、非同期なので、

私は、chartを引数として受け取るmyLogicという名前の関数を追加しました。

希望します。

関連する問題