Question

我的问题是关于正确实现异步功能以获取数据。我有一个名为_getData()的函数，并且正在屏幕的componentDidMount()上调用它。但是，当服务器响应速度很慢时，切换到此屏幕的速度就会变慢。所以我想使用异步功能来获取数据。但是我不确定我是否做得正确。那是正确的方法吗？我不确定它是否可以异步工作。

这是我的Api._getData()代码：

const _getData = async () => {
    return await axios.get("http://blabla.com/someservice", { params: someParamDataHere });
};

export const Api = {
    _getData
};

在SomeScreen.js上，我还具有loadData（）函数，该函数调用上面的函数并进行状态更新。

loadData() {

    Api._getData()
    .then((response) => {
        this.setState({ myData: response.data });
    })
    .catch((error) => {
        console.log(error.response);
    });
}

在同一屏幕的 componentDidMount（）函数中，我直接将此函数称为loadData()。

现在，将Api._getData（）声明为异步并在其中使用await是否足够，还是我也应该更改一些触发函数？

非常感谢您的帮助。

Answer 1

检索load Data时您做得正确。您可以做的是通过在loadData中使用async await尝试更多的es6语法糖，因此

    loadData = async() =>{
    try{
    let response = await Api._getData();
    this.setState({ myData: response.data });
    } catch(err){
    console.log(error.response);
    }
}

希望有帮助。毫无疑问

Answer 2

代替异步等待使用诺言

export const getRequest = (url) => {
  return new Promise((resolve, reject) => {
    api
      .get(url)
      .then((response) => {
        handleReponse(response)
          .then((errorFreeResponse) => {
            resolve(errorFreeResponse);
          })
          .catch((error) => {
            reject(error);
          });
      })
      .catch((error) => {
        reject(handleError(error));
      });
  });
};

如何使用异步功能并通过React Native正确导出？

2 个答案: