在 React Native 中使用 async/await 处理 API 调用答案

【问题标题】：Handling API calls with async/await in React Native在 React Native 中使用 async/await 处理 API 调用
【发布时间】：2019-01-05 11:15:12
【问题描述】：

我想要一个单独的文件用于 API 调用 -

APIHandler.js

const loginAPI = 'https://..../login';

export async function login(emailAddress, pass) {
    const reqOptions = {
        method: 'POST',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
        },
        body: JSON.stringify({

            email: emailAddress,
            password: pass,

        })
    };

    let response = await fetch(loginAPI, reqOptions);
    return response;
}

现在在我的login.js，我想这样做：

onLoginPressed = async () => {
    let response = login(this.state.email, this.state.password)

    if (response.status >= 200 && response.status < 300) {
       //Login success
    } else {
        //Login error
    }
}

但这似乎不起作用。按登录后，没有任何反应。谁能告诉我哪里做错了。

【问题讨论】：

标签： react-native async-await ecmascript-2017

【解决方案1】：

由于login 是一个异步函数，并且您想等待从login 返回的响应，您也必须await 调用login：

let response = await login(this.state.email, this.state.password)

login 本身等待 fetch 调用完成。所以你要等待login 完成，你必须等待它。如果您不这样做，login 会返回一个承诺，正如您所观察到的，它不是来自请求的响应对象。

【讨论】：