Объект watch, асинхронные действия в Vue

Vue позволяет определять наблюдаемые свойства или watchers. Наблюдаемые свойства, как правило применяются для выполнения асинхронных действий, особенно таких, которые могут занять продолжительное время, например отправка запроса на сервер.

Для создания наблюдаемого свойства используется параметр watch. В данном случае определяется наблюдаемое свойство promo, которое определено в параметре data. При изменении свойства promo, которое определено в секции data, будет вызываться функция getSale, определенная в параметре methods:

App.vue<script>
export default {
  data() {
    return {
      promo: '',
      info: ''
    }
  },
  methods: {
    getSale: function (){
      setTimeout(() => {
        // имитация ajax запроса
        this.info = 'Отработал Ajax';
      }, 1000);
    }
  },
  watch: {
    promo(){
      this.getSale();
    }
  }
}
</script>
<template>
  <input type="text" v-model.trim="promo">
  <p>{{ info }}</p>
</template>