How can i access $toast in Nuxt vuex store

Question

i have @nuxtjs/toast installed and working properly in my application.

I want to show a toast after an action is dispatched. How can i access $toast in my actions in my module in the vuex store?

PS: i am using Nuxt with typescript, and from intellisense it seems i can only access $router and $axios.

export const actions: ActionTree<ProfileState, RootState> = {
async updateProfile({ }, user) {
    console.log(user);
    const newUserObj = await this.$axios.post("/me/update", user).then(res => res.data.data);

    console.log(newUserObj);
    // this.$toast.info("Hello");

    // commit('LOAD_NEW_USER', newUserObj);
},
}

Answer 1

First of all, lets fix your action

async updateProfile({commit}, user) {
    return new Promise(async(resolve,reject)=>{
      try {
        const newUserObj = await this.$axios.$post("/me/update", user)
        commit('SET_USER',newUserObj)
        resolve(newUserObj)
        
      } catch (error) {
        reject(error)
      }
     
    })
  },

To show the toast-

Try this.app.$toast below the line commit('SET_USER',newUserObj)