2016-05-24 23 views
0

requireJSの使用に2つの疑問を知る必要があります。requireJSメソッド定義を呼び出す

マイコード:

1. Index.htmlと

<script data-main="js/main" src="js/require.js"></script> 

2.main.js

require(['../page1', '../global'], function(View,global){  
var v = new View(); 
v.init(); 

var g = new global(); 
g.getlanguage(); 
}); 

3.page1.js

define([], function (require) { 
var view1 = function(){ 
    this.init = function(){ 
    $('.page__submit').on('click', function(e) { 
      view1.new_submit(); 
      e.preventDefault(); 
     }); 
    }, 
    this.new_submit = function(){ 
    alert("new submit in.."); 
    } 
}; 
return view1; 
}); 

質問1page1.js onclickのview1.new_submit();が機能していません。方法を呼び出す方法? 質問2私は**main.js****global**を初期化してきたが、私はpage1.js内のグローバルにアクセスすることができませんでした。 助けてください。

+0

Q1について:コンソールをチェックして、DOMがロードされた後でJSを実行していますか? Q2に関して: "global"オブジェクトをコンストラクタのパラメータとして渡してください。現在、ビューが別のスコープの変数にアクセスする方法はありません。 – Sirko

答えて

1

質問1について、あなたはちょうどあなたがthisにアクセスしているかに対処する必要があるので、私はあなたが以下のコード例では、それ自体の上に呼び出すことができるはずですselfを使用して言及しました。 質問2については

、あなたがそれを使用することができますので、あなたのpage1モジュールでglobalモジュールを必要とする必要があるので、私は、依存関係を追加しました。相対的な構造に合わせてパスを変更する必要があるかもしれないことに注意してください。../globalこの質問に対する別のアプローチについては編集を参照してください。

define(['../global'], function (g) { 

    var view1 = function() { 
     var self = this; 

     self.init = function() { 
      console.log(g.getLanguage()); 

      $('.page__submit').on('click', function(e) { 
       self.new_submit(); 
       e.preventDefault(); 
      }); 
     }, 

     self.new_submit = function() { 
      alert("new submit in.."); 
     } 
    }; 

    return view1; 
}); 

EDIT 質問2ためまたは代わりに、あなたはViewinitの引数としてglobalを追加できますが、これはあなたが実際にモジュールを使用する方法に依存です。それは次のようになります - 私はモジュールを持っていることに言及したいと思いますmain.js

var g = new global(); 
g.getlanguage(); 

var v = new View(); 
v.init(g); 
page1.jsインサイド

self.init = function (g) { // g is the module reference 
    console.log(g.getLanguage()); 

    $('.page__submit').on('click', function(e) { 
     self.new_submit(); 
     e.preventDefault(); 
    }); 
}, 

そして最後にインサイド

というグローバルという名前のコードは、そのコードを受け取った将来の開発者を混乱させる可能性があります。モジュールの責任はどういうものか分かりませんが、それを明確にするために名前を変更することを検討してください。

また、何らかの理由でこれを実際にグローバルにすることを検討している可能性があります。この場合は、ウィンドウオブジェクトにmain.jsという名前を付けてください。のようになります。window.global = g;g.getLanguage();のようになります。

<script src="js/global-module.js"></script> 
<script data-main="js/main" src="js/require.js"></script> 

そして、あなたのグローバルモジュールを微調整 - :スクリプトタグを必要とする前にグローバル変数として定義し、例えば、前に独自のスクリプトファイルに必要JSの初期化にglobalいくつかの定義されたオブジェクトを作ることが賢明かもしれそれはジェネリックであることを確認し(したがって、あなたがすることではないAMDがそれを意図しクリア)します -

var global = { 
    property: 'value', 
    myFunction: function() { 
     // etc.. Don't know what format you want or what is in global. 
    } 
}; 

window.global = global; 

PSあなたはglobalグローバル変数を作っている場合は、その後、他のコード、例えばとの衝突を避けるために、それを名前空間を考えますglobalの代わりにmyAppNameGlobalModuleとしてください。

+0

ありがとう@Owen Ayres。各ページに依存性パスを追加する必要がありますか?グローバル変数として設定することは可能ですか? – GaneshKumar

+0

@GaneshKumar私が下に行った編集を見てください。あなたが望むものなら、非AMDモジュールとしてグローバルを定義することをお勧めしますが、それはモジュールの意図を少しも明確にする可能性が高いからです。 – Shakespeare

+0

ありがとうございました。グレート – GaneshKumar

関連する問題