CODEWITHSUNDEEP
vue.jsnuxt.jstoastsweetalert
rozhan
rozhan

Reputation: 341

Using sweet alert toast for error handling in vuex

I have installed sweet alert on my project. Now i want to use it in Vuex actions but it does not work.

update({ commit, dispatch }, data) {
  return new Promise(async (resolve, reject) => {
    try {
      const res = await update(data);
      resolve(res.data)
      this.app.$toast('this is a test toas', {
        title: 'Test'
      })
    } catch (err) {
      this.app.$toast('this is a test toas', {
        title: 'Test'
      })
      reject(err.response);
    }
  })
},

It works fine in components but i can not access it with this.app.$toast

Upvotes: 1

Views: 622

Answers (1)

Anis
Anis

Reputation: 1220

The $toast is only available in component Scope not vuex, I had an issue like that before and I passed this as a reference parameter to toast.

update({ commit, dispatch }, {data , that}) {
return new Promise(async (resolve, reject) => {
  try {
    const res = await update(data);
    resolve(res.data)
    that.$toast('this is a test toas', {
      title: 'Test'
    })
  } catch (err) {
    that.$toast('this is a test toas', {
      title: 'Test'
    })
    reject(err.response);
  }
})

while calling the update method from component pass this reference as

update({
  data,
  that: this
})

Upvotes: 1

Related Questions