Javascript 什么'；对于这种情况，正确的异步/等待实现是什么？

我有一个React组件，其功能类似于：

async getDataSet1(url, config){
        axios.get(url, config)
            .then(function(response){
                if(response.data.length > 0){
                that.setState({ dataSet1: response.data });
                }
            })
            .catch(function (error) {    
                alert('bubble: ' + error.message);
            });
}

async getDataSet2(){
        axios.get(url, config)
            .then(function(response){
                if(response.data.length > 0){
                that.setState({ dataSet2: response.data });
                }
            })
            .catch(function (error) {    
                alert('bubble: ' + error.message);
            });
}

async processData(){
      await getDataSet1();
      await getDataSet2();

      const{
         dataSet1,
         dataSet2,
      } = this.state;
}

processData（）函数需要通过getDataSet1（）和getDataSet2（）获取2个数据集。wait/async的规则是：

• 要使用await调用的异步函数必须将async关键字作为异步函数定义的一部分
• 调用异步函数的函数必须在异步函数定义中包含async关键字

如果在此场景中需要从onClick（）事件处理程序调用processData（），那么我需要如何构造该调用？以下结构似乎无效：

onClick={() => await this.processData()}

---

为了实现我的目标，构建上述代码的正确方法是什么？我当前的实现似乎没有按预期工作。

这里没有什么值得关注的问题

首先，您要求它等待从

getDataSet1

返回的响应，但您没有从函数返回任何内容。因此，响应是

未定义的

，并立即返回。要使这项工作返回

axios

正在返回的承诺：

async getDataSet1(url, config){
        return axios.get(url, config)
            .then(function(response){
                if(response.data.length > 0){
                  return response.data
                }
            })
            .catch(function (error) {    
                alert('bubble: ' + error.message);
            });
}

您可能已经注意到，我还从函数中删除了

setState

。这是因为并没有回报的承诺，所以你不能等待它。因此，我们必须返回结果并对其采取行动

async processData(){
      const dataset1 = await getDataSet1();
      const dataset2 = await getDataSet2();
      // If you want to set it to state.
      this.setState({ dataset1, dataset2 });
}

其次，

await

仅当下面的语句取决于它的结果时才需要使用。有了这个逻辑，

onClick

函数就不需要它了，您可以调用这个函数，让它在异步中发挥神奇的作用

onClick={() => this.createStructuredBolData()}