我在使用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
。
请帮忙。
答案 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
。