[Vuejs]-Promise Chain Out of Order

1👍

You need to convert addJournal into something that returns a promise, so that it can be consumed with then:

addJournal(context, journal) {
  console.log("this is for users", context.state.user.id)
  context.dispatch('getFeed');
  return axios.post("/api/users/" + context.state.user.id + "/journals", journal).then(response => {
    return context.dispatch('getFeed');
  }).catch(err => {
    console.log("addJournal failed:", err);
  });
}

Not sure what context.dispatch('getFeed'); does, but since posting is asynchronous, there shouldn’t be anything wrong with moving it above the axios.post line. axios.post returns a promise already, so you just need to return it.

-1👍

.then() works on promise

for this.$store.dispatch('addJournal').then(...) to work as expected, addJournal should be a promise.

Here’s how

  addJournal(context, journal) {
    return new Promise((resolve, reject) => {
      axios
        .post("/api/users/" + context.state.user.id + "/journals", journal)
        .then(response => {
          context.dispatch("getFeed");
          resolve();
        })
        .catch(err => {
          console.log("addJournal failed:", err);
          reject(err);
        });
    });
  }

Leave a comment