JS: Как отложить выполнение функции

Question

Попытка смонтировать компонент Vue.js, но, похоже, вторая функция (eventSelection) вызывается раньше, чем ожидалось. Что я должен сделать, чтобы он выполнялся только после завершения первой функции?

...
mounted() {
  this.getAllEvents()
  this.eventSelection()
},

methods: {
  getAllEvents: function () {
    console.log("Cheguei aqui");
    getEvents()
    .then( function (res) {
      console.log("Entrei then")
      this.events = res.data
    }.bind(this))
    .catch( function (err){
      debugger;
      console.error('WeekSimulation, getEvents() ', err)
      this.events = ["Seu chefe o convida para um happy hour com os diretores no final do expediente.  Ao mesmo tempo, você recebe uma mensagem de seu cônjuge lembrando da apresentação no colégio do seu filho. O que você faz?", "Você tem muito trabalho a fazer, porém o tempo com sua família anda escasso. No final do expediente você escolheria jantar com sua família ou fazer hora extra?",
                         "Você acorda de manhã e seu filho não está se sentindo bem. Ao verificar sua agenda, lembra que tem uma reunião com um novo cliente em uma hora. Você leva seu filho ao médico ou vai para a reunião?", 
                         "Ao checar o seu celular durante uma reunião com os diretores de sua organização, nota que recebeu cinco ligações de seu cônjuge. Você continua na reunião, ou pede para atender o telefone?"]
    }.bind(this))
  },

  eventSelection: function() {
    console.log("Funcao de selecao de evento")
    debugger;
    this.selectedEvent = _.shuffle(this.events)[0]
    console.log(this.selectedEvent)
  }      

}
...

Answer 1

Используйте простой обратный вызов:

 mounted() {
   this.getAllEvents(this.eventSelection);
 }

 getAllEvents: function (cb) {
    ...
    cb();
 },

  eventSelection: function() {
   ...
  }

Answer 2

Верните обещание getEvents() из getAllEvents(), чтобы вы могли связать с ним еще одну then() и вызвать eventSelection() после разрешения getEvents ()

mounted() {
  this.getAllEvents().then(this.eventSelection)

},

methods: {
  getAllEvents: function () {
   // return the promise
   return getEvents()
    .then( function (res) {
      ....
    }.bind(this))


}

Также обязательно добавьте return this.eventsв catch для разрешения первоначального обещания

Answer 3

Вам нужно использовать promises(). Я не мог понять ваш код, мои извинения, вот общий пример:

first = function(){
    var deferred = new $.Deferred();
    console.log("first running");
    deferred.resolve();  // <----------resolve the deferred
    return deferred.promise();
}

second = function(){
    console.log("second running..sigh..");
}

$(document).ready(function() {

    first().then(second);

});