Как дождаться результата ответа одной функции в другой?

Question

[reinmaker90]

Есть фетч запрос, который получает город:

fetch(url + query, options)
                    .then(response => response.json())
                    .then(data => this.currentCity = data.location.data.city)
                    .catch(error => console.error(error))

И есть другой запрос, который получает в данном варианте погоду:

fetch(`${this.base_url}weather?q=${this.currentCity}&units=metric&APPID=${this.api_key}`)
                    .then(response => response.json())
                    .then(data => this.weatherResult = data)

Проблема в том, что в this.currentCity в момент фетч запроса храниться undefined, и в итоге в запросе ошибка, т.к. локация не определена. Как дождаться результата первого фетча и после этого уже выполнить второй запрос?

Answer 1

[Алексей Уколов]

this.weatherResult = await fetch(url + query, options)
    .then(response => response.json())
    .then(data => data.location.data.city)
    .then(currentCity => fetch(`${this.base_url}weather?q=${currentCity}&units=metric&APPID=${this.api_key}`))
    .then(response => response.json())

или

const firstResponse = await fetch(url + query, options);
const data = await firstResponse.json();
const currentCity = data.location.data.city;
const secondResponse = await fetch(`${this.base_url}weather?q=${currentCity}&units=metric&APPID=${this.api_key}`);
this.weatherResult = await secondResponse.json();

Comments

[reinmaker90]

а если в 2 разных функции вынести то просто обернуть по аналогии в async/await и т.к это промисы, то ожидать результатов, верно я понимаю?

[InsaffHairullin]

const firstResponse = await fetch(url + query, options);
const data = await firstResponse.json();
const currentCity = data.location.data.city;
const secondResponse = await fetch(`${this.base_url}weather?q=${currentCity}&units=metric&APPID=${this.api_key}`);
this.weatherResult = await secondResponse.json();

я обычно так делаю

[Алексей Уколов]

Ну да, вы можете разбить это на две асинхронные функции и ждать их результата.

[reinmaker90]

всем большое спасибо!