requireJS方法调用define

时间:2016-05-24 14:32:10

标签: jquery requirejs

我在使用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;
});

问题1 page1.js onclick view1.new_submit();无效。如何调用方法? 问题2 我已在**global**中初始化了**main.js**,但我无法访问全局内部 page1.js 。 请帮忙。

1 个答案:

答案 0 :(得分:1)

对于问题1 ,您只需要说明访问this的方式,因此我使用self进行了引用,以便您可以在下面是示例代码。

对于问题2 ,您需要global模块中的page1模块,以便您可以使用它,因此我添加了依赖项。请注意,您可能需要更改../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;
});

编辑问题2 ,您可以将global作为参数添加到init的{​​{1}},但是这取决于您希望如何实际使用模块。它看起来像这样: -

内部 main.js

View

内部 page1.js

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

var v = new View();
v.init(g); 

最后我想提一下,拥有一个名为 global 的模块可能会让那些拿起该代码的开发人员感到困惑。我不确定模块的责任是什么,但考虑将其重命名为更清楚。

或者你也可能因为某种原因想要实现全球化。在这种情况下,只需将其附加到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;一样。在自己的脚本文件中,在需要JS init之前使g.getLanguage();某个已定义的对象可能是明智的,例如,在require脚本标记之前将其定义为全局变量: -

global

调整你的全局模块以确保它是通用的(因此很明显你不打算成为AMD): -

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

PS 如果您要将var global = { property: 'value', myFunction: function () { // etc.. Don't know what format you want or what is in global. } }; window.global = global; 作为全局变量,请考虑使用命名空间来避免与其他代码发生冲突,例如: global而非myAppNameGlobalModule