[Vuejs]-Handle api response before committing next mutation

by

1👍

✅

It seems you misunderstood what mutations and actions for. Mutations can’t be asynchronous and should modify state only. In contrast to them actions can be asynchronous, can request some data and after that can put these data to a state using mutations.

So all in all your code should look like this:

mutations: {
  setUserInfo (state, username) {
    state.requestUser = username
  },
  setUserProfile (state, profile) {
    state.profile = profile
  }
...
actions: {
  async requestUserInfo ({ commit }) {
     const data = await apiService("/api/user/")
     commit('setUserInfo', data["username"])
  },
  async requestUserProfile ({ dispatch, commit, state }) {
      await dispatch('requestUserInfo') // wait for `requestUserInfo` to finish
      let endpoint = "api/profile/";
      if (state.requestUser) {
        const data = await apiService(endpoint)
        commit('setUserProfile', data)
      }
  }

Leave a comment