ReactJS - 推送到承诺外的列表

我想更新在承诺（API调用）之外定义的列表。ReactJS - 推送到承诺外的列表

这里是代码：

let data = []; 
    api.getData(this.state.ID).then((resp) => { 
    data = [...data, { title : resp.title }]; 
    data = [...data, { name : resp.name }]; 
    }); 
    console.log(data); // --> it returns []

的数据是[]和没有价值已经推到它。我怎样才能改变我的代码来解决这个问题？由于某些原因，我不想使用setState()

此致。

来源

2017-09-28 Adel

如果这正是为了在其编写的代码，它会返回[]因为api.getData是异步的。 – semuzaboi

最终，你想呈现这些数据，对吗？留意别人的建议以解决手头的问题，但根据你的写作方式，如果没有'this.setState'就无法完成。我假设你没有使用REDX。 – Andrew

可能的重复[如何从异步调用返回响应？]（https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call） –

承诺是总是异步，这意味着您的数据数组在您定义承诺后仍然是空的。

要访问已填充的数据数组，您必须在promise中引用它。

let data = []; 

api.getData(this.state.ID).then((resp) => { 
    data = [...data, { title: resp.title }, { name: resp.name }]; 

    console.log(data); 
});

来源

2017-09-28 09:57:35 euvl

您的console.log函数在api返回数据之前正在执行。尽管数据在api调用后得到更新。你看不到它，因为它在这之前就被安慰了。

let data = []; 
    api.getData(this.state.ID).then((resp) => { 
    data = [...data, { title : resp.title }]; 
    data = [...data, { name : resp.name }]; 
    Console.log(data) 
})

现在您可以看到数据控制台。

但是如果你想在控制方法之后控制数据，那么你可以使用npm模块q来同步执行api。

来源

2017-09-28 09:57:48

异步/等待将帮助您：

let data = []; 
async function getData() { 
    await api.getData(this.state.ID).then((resp) => { 
    data = [...data, { title : resp.title }]; 
    data = [...data, { name : resp.name }]; 
    }); 
    console.log(data); // --> it shouldn't return empty array 
} 
getData();

例子：

function resolveAfter2Seconds(x) { 
 
     return new Promise(resolve => { 
 
     setTimeout(() => { 
 
      resolve("You see it after promis end"); 
 
     }, 2000); 
 
     }); 
 
    } 
 
    
 
    
 
    var arr = []; 
 
    async function f1() { 
 
     await resolveAfter2Seconds(10).then(res => arr.push(res)); 
 
     alert(arr); 
 
    } 
 
    f1();

来源

2017-09-28 10:00:09 Andrew

ReactJS - 推送到承诺外的列表

回答

相关问题