How to abbreviate interdependent asynchronous requests?

The

logic goes like this:
phone number = "get city name =" get city code = "get city weather

the next request will use the result of the last request

I have tried the following two ways of writing, and I feel very verbose. Is there any good way to write it?

// async
onFetchPosition = async () => {
    const { actions } = this.props;
    const data = await API.fetchPosition(this.state.number);
    const city = await API.fetchCityCode(data.data.result.province);
    const weather = await API.fetchWeather(city.data.code);
    actions.fetchPhonePosition(data.data.result);
    actions.fetchCityCode(city.data);
    actions.fetchWeatherInfo(weather.data.weatherinfo);
}
// promise
 onCheckPosition = () => {
    new Promise((resolve) => {
      API.fetchPosition(this.state.number, (position) => {
        this.props.actions.fetchPhonePosition(position);
        resolve();
      });
    }).then(() => {
      API.fetchCityCode(this.props.position.province, (city) => {
        this.props.actions.fetchCityCode(city);
        API.fetchWeather(this.props.position.code, (weather) => {
          this.props.actions.fetchWeatherInfo(weather);
        });
      });
    }).catch((error) => {
      throw new Error(error);
    });
  };
Mar.03,2021

your writing is the best way to write it. At present, async is the best way to deal with callback hell


is not the answer
Why not let the backend do it, just give the phone to the backend, and the city where the backend aggregates the phone number will be returned to you together with the weather. How simple it is

Menu