React使用axios调用API成功但返回data为undefined如何解决？

问题原因 #

axios.get() 是异步方法，默认返回Promise对象而非接口响应结果，你的代码中没有添加await关键字等待请求完成，直接对Promise对象解构取data属性，Promise本身不存在该属性，所以得到undefined。

修复方案 #

在axios.get()前添加await关键字即可，修改后代码如下：

export const getXFlowdata = async () => {
    try{
        const {data} = await axios.get(xurl, { headers: headers });

        console.log('Data: ', data)
        console.log('Data Type: ',typeof data)
       
        return data;
 
    }catch(error) {
        throw error;
    }
}

补充说明 #

async函数中，只有加了await关键字后，函数才会暂停执行等待异步请求完成，拿到返回结果后再执行后续的打印、返回逻辑，这也是参考示例代码中存在await关键字的原因。

内容的提问来源于stack exchange，提问作者Sun