Обработать запрос axios

Question

подскажите есть множество ссылок с клиентами, при клике по ним отправляется запрос с id и получаю ответ с количеством контрактов, после в консоль вывожу если 0

Но проблема в том что свойство workout_contracts в которой записывается результат медленно обновляется, получается при клике условие отрабатывает прошлый результат.

Подскажите как решить проблему ? Или как правильно отработать полученный результат ?

axios.post('api/v2/workout/' , {id : id})
.then(response => this.workout_contracts = response.data)

if (this.workout_contracts == 0) {
        console.log("Нет активных контрактов");
            return null
    }

Answer 1

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

Так как запрос асинхронный, то в момент клика, отправляется запрос, потом идет обработка условия и только потом вывод в консоль с указанием, ноль контрактов или нет.

Если вынос этой части был специальным, укажите почему, это позволит принять другое решение.

Answer 2

Для того, чтобы всё сработало с тем же примером, нужно сделать следующее:

Обьявить метод асинхронным

<script>
      import axios from 'axios';
      
      export default {
        name : 'TestComponent',
        props : {
          id : {
            type : Number,
            required : true
          }
        },
        methods : {
          async workoutContracts(id) {
            await axios.post('/api/v2/workouts', {id})
            .then(response =>  response.data)
            .then(data => this.workoutContracts = data.workoutContracts || []);
            
            if (!this.workoutContracts) {
              console.log('Контракты отсутсвуют');
              return null;
            }
          }
        },
        async mounted() {
          await this.workoutContracts(this.id);
        }
      }
    </script>

Таким образом, Вы сможете корректно обработать результат.

БЛОГ НА HUSL

Обработать запрос axios

Ответы (2 шт):