Question

我的React应用中有一个api调用

function apicall(input) {
    return fetch(url)
    .then(response =>
        response.json())
}

这是从另一个文件调用的

apicall(input).then(responseData => {
    //responseData is an array
    //some action->    responseData.map(
})

我觉得这种方法不正确，我只希望apicall返回数据。想法是这样的：致电apicall 获取数据将响应分配给变量循环响应（而不是在then内部进行响应）

Answer 1

在处理Promise时，您必须使用.then语法或async/await方式。

您可以做这样的事情


    async function apicall(input) {
        return fetch(url)
        .then(response =>
            response.json())
    }


    // in some other file

    (async function(){ // enclosing function must be async
      const data = await apicall(input)
    })

Answer 2

您的方法是正确的，只是从正确的位置返回数据，只需要使用async/await，

async function apicall(input) {
    await fetch(url)
    .then(response =>
        response.json()
    )
    .then(response => {
        console.log(response);
        return response;
    })
}

您的apicall应该是

const returnData = apicall(input);
//do your operations on returnData here

Answer 3

如果要同步加载数据，那么这是最好的方法。否则，如果您使用async/wait方法，则主线程将被阻塞，直到得到响应为止。如果您要创建服务器渲染的页面，则这种（async/wait）方法很好。对于async/wait方法，请遵循@Prithwee Das的回答。

在React中解决承诺后执行操作

3 个答案: