Question

如何在使用.fetch和promises的函数之外使用对象？

如果我有

getBuildList();

function getBuildList(){
  fetch('http://127.0.0.1:8000/builds/buildStatsAPI')
    .then(function(res){
      return res.json();
    })
    .then(function(data) {
      initialLoad(data);

    })
    .catch(function(err){
      console.log(err);
    });
}

我想在此功能范围之外使用data。

我尝试在此函数内的几乎所有位置添加return data，但似乎无法使其在此函数范围之外可用。理想情况下，我只想从API一次获取此数据，然后在DOM上按下按钮时以不同的功能重新使用获取的数据。

我已经尝试过（包括许多其他方法）：

getBuildList();
let jsonData = getBuildList();
console.log(jsonData); //expecting data from fetch. but returns undefined

function getBuildList(){
  fetch('http://127.0.0.1:8000/builds/buildStatsAPI')
    .then(function(res){
      return res.json();
    })
    .then(function(data) {
      initialLoad(data);
      let myData = data;
      return myData;

    })
    .catch(function(err){
      console.log(err);
    });
}

Answer 1

只需兑现承诺：

'Adds line to table in Training Master, links appropriate cells to
    MsgBox sp1 Is Nothing
If Not sp1 Is Nothing Then
    MsgBox sp1.Address
    sp1.Offset(0, -2).Resize(1, 19).Insert
    sp1.Offset(-2, -1).Copy sp1.Offset(-1, -1)
    sp1.Offset(-2, 9).Copy sp1.Offset(-1, 9)
End If

然后使用.then消耗结果：

function getBuildList(){
  // (note the "return" below, otherwise result will be undefined.
  return fetch('http://127.0.0.1:8000/builds/buildStatsAPI')
    .then(function(res){
      return res.json();
    })
    .then(function(data) {
      initialLoad(data);
      let myData = data;
      return myData;

    })
    .catch(function(err){
      console.log(err);
    });
}

编辑：要将结果存储在全局变量中，请按如下所示编辑最后一段代码：

getBuildList().then(function(jsonData){
    // use jsonData here.
}).catch(function(error){
    // Handle the error here.
});

在点击时消耗数据的示例（确保调用了上述功能之后）

var jsonData = null; // <-- global variable
getBuildList().then(function(res){
    jsonData = res;
}).catch(function(error){
    // Handle the error here.
});

Answer 2

也许async / await语法对您来说更容易理解。

async function getBuildList(){
  const response = await fetch('https://pokeapi.co/api/v2/pokemon/ditto/');
  return response.json();
}

(async () => {
  const data = await getBuildList();
  console.log(data)
})()

在功能/承诺范围之外使用对象

2 个答案: