异步等待在React JS应用程序中无法正常工作

Question

我用async和await创建了一个简单的react js应用程序。但是当我调用异步函数时，它并不是在等待ajax调用的响应。

class Test extends Component {
   componentDidMount() {
     this.getData();
   }

   async getData() {
     await this.props.getDataFromDB();
   }
}

如果我将异步添加到componentDidMount并使用await this.getData（），它将正常工作。但是当我调用this.getData（）时，它并不是在等待结果。

为什么会这样？

Answer 1

异步等待返回一个诺言，并且如果调用异步函数的函数尚未准备好等待它，那么该诺言将不会被捕获。 还要避免使用生命周期方法的componentDidMount'type'。 react引入的钩子的最新版本将“ useeffect”用于组件生命周期方法。

Answer 2

异步函数声明定义了一个异步函数，该函数返回一个AsyncFunction对象，因此我们需要使componentDidMount也成为一个异步函数