如何將參數傳遞給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);
            }
        });
    }
}
})();