如何将参数传递给ajax函数的回调

Question

我正在调用API服务器的ajax。 我正在从我的代码中的多个位置对/getobjectdetails/进行特定调用，所以我想我会尝试使它更清洁，但这是我第一次深入研究这样的回调。 这是我尝试的代码：

let api = (function () {
    return {
        getObjectDetails(id, successCallback, errorCallback) {
            $.ajax({
                type: 'GET',
                url: app.apiServerRoot + '/api/getobjectdetails/?Id=' + id,
                beforeSend: function(xhr) {
                    xhr.setRequestHeader("Authorization", "Bearer " + user.authToken);
                },
                success: successCallback(data,s,xhrdata),
                error: errorCallback(e)
            });
        }
    }
})();

但是当我把它称为测试时：

api.getObjectDetails(1008,function(data,s,x){console.log(data)},function(e){console.log(e)})

我收到以下错误：

Uncaught ReferenceError: data is not defined
    at Object.getObjectDetails (api.js:13)
    at <anonymous>:1:5

我究竟做错了什么？

Answer 1

将您的ajax成功参数更改为：

{
    ...,
    success: successCallback,
    error: errorCallback
}

您之前的方式是直接执行该功能。 您想传递函数的引用而不执行它。

例如，当您绑定click事件时，您希望传递引用：

button.addEventListener('click', myCallback);

并不是

button.addEventListener('click', myCallback());

Answer 2

正如错误所指出的，当您调用successCallback ，未定义数据。

尝试这个：

let api = (function () {
    return {
        getObjectDetails(id, successCallback, errorCallback) {
            $.ajax({
                type: 'GET',
                url: app.apiServerRoot + '/api/getobjectdetails/?Id=' + id,
                beforeSend: function(xhr) {
                    xhr.setRequestHeader("Authorization", "Bearer " + user.authToken);
                },
                success: (data, s, xhrdata) => successCallback(data,s,xhrdata),
                error: (e) => errorCallback(e)
            });
        }
    }
})();

箭头函数表示法和函数声明之间没有太大区别。

您可以写下以下任何一个：

success: (data, s, xhrdata) => successCallback(data, s, xhrdata)

success: (data, s, xhrdata) => { 
    successCallback(data, s, xhrdata); 
}

success: function(data, s, xhrdata) {
    successCallback(data, s, xhrdata);
}

Answer 3

你需要传递success和error的功能。 你不应该自己调用这个功能。

当您将括号放在函数名称后面时，它会立即调用它。 所以，而不是你写的，它应该是：

let api = (function () {
return {
    getObjectDetails(id, successCallback, errorCallback) {
        $.ajax({
            type: 'GET',
            url: app.apiServerRoot + '/api/getobjectdetails/?Id=' + id,
            beforeSend: function(xhr) {
                xhr.setRequestHeader("Authorization", "Bearer " + user.authToken);
            },
            success: function(data, s, xhrdata) {
                successCallback(data,s,xhrdata);
            },
            error: function(e) {
                errorCallback(e);
            }
        });
    }
}
})();