Выполнить код после асинхронного запроса 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. Напишите первый комментарий
*Комментарий будет опубликован после проверки модератором

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

jQuery.Maskedinput js - документация на русском с примерами

Маска для ввода телефона +7(___)___-__-__

Настройка Webpack - несколько точек входа и разделение на чанки

Отключить автозаполнение input

Универсальная форма обратной связи — feedBackForm

Слайдер Slick slider в контенте ресурса

Bxslider отображение картинок после полной загрузки слайдера

Как сделать переменную не реактивной в Vue

Как обработать POST данные в PHP

Примеры использования Vuex

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

Заготовки JavaScript

Как вызвать метод из другого компонента Vue

Связать значения инпутов через jQuery (биндинг)

Рекурсивно вложенный компонент Vue

Настроить Axios чтобы принимал только JSON

Использование async/await в JavaScript с Vue.js

Использование Promise.all с примерами на VueJs

Js-beautify - библиотека для форматирования HTML, CSS, JS

Создание цикла асинхронных вызовов во Vue.js

Манипуляция с HTML во Vue.js и cash-dom

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