Выполнить код после асинхронного запроса axios во Vue

Задача / вопрос: Как запустить метод, который включает в себя асинхронный запрос, и выполнить код только по завершению работы этого метода.

Решение очень простое — вернуть промис. Т.е. достаточно добавить return перед вызовом функции axios(...

get_user_data: function(){
  return axios(/* Ваши настройки вызова axios */).then(response => {
    // Сохраняем полученные данные
    this.user = response.data.user_data;
  });
},
/* А в компоненте из другой части галактики */
method_after_async: function(){
  this.get_user_data().then(() => {
    // Выполнить действия с данными,
    // которые были получены в асинхронном методе get_user_data
  });
}

Если нам нужно чтобы асинхронный метод get_user_data что-то возвращал, то код будет выглядеть так:

get_user_data: function(){
  return axios(/* Ваши настройки вызова axios */).then(response => {
    this.user = response.data.user_data;
    return 'some data to return';
  });
},
method_after_async: function(){
  this.get_user_data().then((args) => {
    console.log(args);
  });
}

Комментарии (0)

  1. Напишите первый комментарий
*Комментарий будет опубликован после проверки модератором

Похожие статьи

Наш сайт использует куки, нажмите «ОК» если вы не против
OK