Question

我想在模块中创建一个函数，该函数可以使用各种依赖项但在模板中调用，到目前为止我只收到了函数未定义的错误。我哪里出错了，或者这根本不可能？

helper.js module

define(['aDependency'],function(){

    var sayHi = function(){
        console.log('Hi');
};
return{
    sayHi: sayHi
}

我的主文件中需要此模块

requirejs(['lib/helper']);

我想在我的模板中使用该功能;

<button data-remodal-action="confirm" onClick="sayHi()"/>

但是我得到了一个不确定的功能。

非常感谢任何帮助。

干杯

Answer 1

您似乎正试图在全球范围内调用sayHi函数，但不是因为requirejs模块具有隔离范围

像这样使用它 - <button data-remodal-action="confirm" onClick="sayHi()"/> 你应该做点什么

requirejs(['lib/helper'], function(helper){
    window.sayHi = helper.sayHi;
});

但它是一个反模式来设置将从HTML调用的全局变量。我建议你做这样的事情

HTML：

<button id="sayHiButton" data-remodal-action="confirm"></button>

JS：

requirejs(['lib/helper'], function(helper){
    document.getElementById('sayHiButton').addEventListener('click', function(){
         helper.sayHi();
    });
});

Answer 2

你不能那样做

<button data-remodal-action="confirm" onClick="sayHi()"/>

指向全局功能。

您的sayHi()函数是helper模块返回的对象的一部分。这根本不是全球性的。如果要将该功能添加为按钮上的单击事件，则必须在可见的位置执行此操作。

这是帮助模块内部

define(['aDependency'],function(){

    var sayHi = function(){
        console.log('Hi');
    };
    $('button').click(sayHi);
return{
    sayHi: sayHi
}

或

使用辅助模块的内部模块：

requirejs(['lib/helper'], function (helper) {
  $('button').click(helper.sayHi);
});

RequireJS从模块返回一个函数，用于模板

2 个答案: