在 JavaScript 中等待 ajax 调用

问题描述

我知道有很多关于这个的问题和答案，但我是 JavaScript 的新手，我正面临 async/await 函数的问题。我有两个函数：getInvoices() 用于获取所需数据的 ajax 调用，以及呈现条形图的 loadBarChart(data)。对于图表，我使用 ApexCharts。所以我首先调用 getInvoices() 函数来获取数据，然后我调用 loadBarChart(data) 传递数据，如下所示：

$(document).ready(function () {
    var data = getInvoices();
    console.log(data); // data is undefined
    loadBarChart(data); 
 });

data 总是 undefined 可能是因为 ajax 调用没有完成。

这是getInvoices()函数代码：

function getInvoices() {
    var url = "@Url.Action("GetInvoiceCustum");
        $.ajax({
            type: "GET",dataType: "json",url: url,success: function (data) {
                return data;
            },error: function (jqXHR,textStatus,errorThrown) {
                alert(textStatus);
            }
        });
    }

在 this 之后我更改了代码，但最后我不知道如何将数据从 getInvoices() 传递到 loadBarChart(data);

到目前为止，这是我所拥有的：

$(document).ready(function () {
    var url = "@Url.Action("GetInvoiceCustum");
    var ajax1 = new Promise((resolve,reject) => {
        $.ajax({
            type: "GET",success: function (data) {
                resolve("OK");
                result = data;
            },error: function () {
                reject(" ERROR");
            },});
    });

   //At this point how can I acces the result from ajax call,and call the loadBarChart(data)
     ajax1.then(values => {
        console.log(values)
     },reason => {
        console.log("Errors: " + reason)
     });

    ajax1.then(function (data1) {
        var data = data1.result;
        console.log(a);
        return data1.result;
        //loadBarChart(data);
    })

});

这样做我如何访问返回 getInvoices() 然后调用 loadBarChart(data) 的数据，或者有其他方法可以使这成为可能？

解决方法

您可以像第一个函数一样成功调用第二个函数

constants.ts