Vue.js wait for axios response before executing another function

Question

my app needs token for every api call it makes. my problem is the functions are being executed before i make gettoken()

so my question is how to stop vue from executing code until gettoken() is finished

My Code main.js

methods:
{
  getValidToken() {
    if (VueCookies.get('token') === null) {
      let requestBody = {
        client_id: "shopping_oauth_client",
        client_secret: "shopping_oauth_secret"
      };
      let requestHeader = {
        Authorization:
          "Basic c2hvcHBpbmdfb2F1dGhfY2xpZW50OnNob3BwaW5nX29hdXRoX3NlY3JldA",
      };
      window.axios
        .post(window.main_urls["get-token"], requestBody, {
          headers: requestHeader
        })
        .then(response => {
          VueCookies.set("aamts2124222", response.data.access_token);
          return VueCookies.get("token");
        });
    } else {
      return VueCookies.get("token");
    }
  }
}

cart.vue

getCartContent() {
  let requestHeader = {
    Authorization: "Bearer " + this.getValidToken()
  };
  window.axios
    .get(window.main_urls["get-cart"], { headers: requestHeader })
    .then(response => {
      if (response.data.error === "Cart is empty") {
        this.emptyCart = true;
        this.loading = false;
      } else {
        this.loading = false;
        this.cartData = response.data.data;
      }
    });
},

So how to wait to getValidToken() then execute getcartcontent()

Utsav Patel · Accepted Answer · 2020-04-06 11:55:22Z

1

You can use async-await in your getCartContent() method.

Like so:

async getCartContent() {
  let token = await this.getValidToken();
  let requestHeader = {
    Authorization: "Bearer " + token
  };

This will make sure that your requestHeader will have token before it executes that line.

answered Apr 6, 2020 at 11:55

Utsav Patel

2,9171 gold badge19 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Vue.js wait for axios response before executing another function

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related