首页 > 解决方案 > 如何从 then() 方法的 api 请求中获取数据,以便在函数外部处理数据?

问题描述

如何从 then() 方法的 api 请求中获取数据,以便在函数外部处理数据。例如,我可以将数据存储在状态对象中以及如何做到这一点。

// openweathermap async await api request
async function getData(){

try{
const url = `http://api.openweathermap.org/data/2.5/forecast? 
                     q=${city}&units=metric&appid=${key}`;
const data = await axios(url)

console.log(data)
        return data;
}catch(error){
    temperature.insertAdjacentHTML('afterend', '<div id="error">Oooops 
                                         something went wrong!</div>');

}

}
 getData().then( data => {

        const temp = data.data.list[0].main.temp;
        temperature.textContent =  temp.toFixed(1) + ' \xB0' + "C ";
        const temp2 = data.data.list[1].main.temp;
        temperature2.textContent =  temp2.toFixed(1) + ' \xB0' + "C ";

        const forecast = data.data.list[0].weather[0].description;
                       foreCast.textContent = forecast.toLowerCase();
        const forecast2 = data.data.list[1].weather[0].description;
                        foreCast2.textContent = forecast2.toLowerCase();

        const icon = data.data.list[0].weather[0].icon
                   weatherIcon.insertAdjacentHTML('afterbegin', `<img 
                   src="http://openweathermap.org/img/w/${icon}.png">`) 
        const icon2 = data.data.list[1].weather[0].icon
                   weatherIcon2.insertAdjacentHTML('afterbegin', `<img 
                   src="http://openweathermap.org/img/w/${icon2}.png">`) 

                    day.textContent = newTime;
                   day2.textContent = newTime2;

       })

标签: javascriptpromiseasync-await

解决方案


应该axios(url)axios.get(url)

然后你可以在回调函数中处理数据:

getData().then(data => console.log(data))

推荐阅读