调用另一个模块函数作为回调 [ES6]

Question

我有一个关于 ES6 模块以及如何在它们之间正确调用函数作为回调的问题。

接受"page_API.js"，收到数据后调用回调函数

// Make a call to our server, Once we've recieved data we'll call our callback

import {requestExecuteAsync} from "../xml_functions";

export const getData = () => {
    requestExecuteAsync('api/getData', "dataRecieved");
};

 export const dataRecieved = () => {
     alert('Recieved Data');
 };

现在，在我处理此 requestExecuteAsync 等的 "xml_functions.js" 中，我想在服务器响应后调用 dataRecieved。

以前我使用的代码库由许多 JS 文件组成，所有函数都位于全局命名空间中，所以函数是这样工作的

// once data has been retrieved from server
if (callbackparamsArr.length) {
    window[callback](res, callbackparamsArr);
} else {
    window[callback](res);
}

但是现在回调函数在 window 中未定义，因为它不再具有 dataRecieved 的范围。

我试过在 xml_functions

中包含 dataRecieved 函数

import { dataRecieved } from "../MyPage/MyPage_API.js";

然后打电话给

[callback](res)

但是由于 "dataRecieved" 导入得到了 requestExecuteAsync 中定义的不同字符串（例如，它将被称为“_Data_Recieved_”而不是 "dataRecieved" 我不确定是什么要做。

如有任何帮助，我们将不胜感激！

谢谢

Answer 1

您不应传递要调用的回调函数的名称。只传递函数本身：

import {requestExecuteAsync} from "../xml_functions";

export function getData() {
    requestExecuteAsync('api/getData', dataReceived);
//                                     ^^^^^^^^^^^^
}
export function dataReceived() {
    alert('Recieved Data');
}

export function requestExecuteAsync(path, callback) {
    …
    if (typeof callback == "function") callback(res);
    …
}

但由于您使用的是 ES6，您可能想看看 promises，这样您就根本不需要传递回调函数。

调用另一个模块函数作为回调 [ES6]

Calling another module function as callback [ES6]

javascript

webpack

es6-modules