如何进行API调用以显示数据?

时间:2019-02-12 21:35:15

标签: javascript api

我需要进行API调用。该API由包含对象的几个数组组成,这些对象有18个键,我需要显示这些键。

如何显示所有内容?我已经尝试过执行fetch和ajax调用,但是它们似乎都不起作用。我在这里做错了什么?预先感谢。

async function events() {
  return $.ajax("/api/address");
  getEvents: function getEvents() {
    return $.ajax("/api/address");
  };
  targetMarket: function targetMarket(id, events) {
    return events.filter(function(event) {
      return event.eventID === id;
    });
  };
  eventsName: function eventsName(events, name) {
    return events.filter(function(event) {
      return events.event.eventID === events.eventID;
    });
  };
}

1 个答案:

答案 0 :(得分:0)

从一开始,API调用就显得有些令人生畏,坚持下去!

这是一个使用对API的Ajax调用获取简单数据的示例。这是纯JavaScript,不需要库:

let cryptoData;

function ajaxGet(url) {
  return new Promise(function(resolve, reject) {
    let req = new XMLHttpRequest();
    req.open('GET', url);
    req.onload = function() {
      if (req.status === 200) {
        resolve(req.response);
        cryptoData = JSON.parse(req.response); // the API response with the data is here (req.response). We use the JSON.parse() method to convert req.response string into a JSON object, since it originally comes in as a string.
        showAjaxData();
      } else {
        reject(Error(req.statusText));
      }
    };
    req.onerror = function(err) {
      reject(Error("Looks like we've got an error..."));
    };
    req.send();
  });
}


function showAjaxData() {
  console.log(cryptoData[0]);
}

ajaxGet(`https://api.coinmarketcap.com/v1/ticker/bitcoin/`);

您可以在此JS Fiddle demo上查看运行中的代码。只要记住open the browser console来查看记录的API数据即可。

随时查看此w3schools tutorial on Ajax calls

希望这会有所帮助:)