avil13 / vue-sweetalert2

A convenient wrapper for sweetalert2.
https://avil13.github.io/vue-sweetalert2/
656 stars 75 forks source link

No methods available in Nuxt #95

Closed selfagency closed 4 years ago

selfagency commented 4 years ago

I've added 'vue-sweetalert2/nuxt' to modules in nuxt.config.js.

If I call this in my app, it works just fine:

this.$swal({
  title: 'Login',
  [...]
})

But if I call this:

this.$swal.fire({
  title: 'Login',
  [...]
})

I get:

TypeError: _this.$swal.fire is not a function

None of the Sweetalert2 methods work. And if I try something like this:

export default {
  data() {
    return {
      popup: null
    }
  },
  methods: {
    firePopup() {
      this.popup = this.$swal({
        title: 'Login',
        [...]
      })
    },
    updatePopup() {
      this.popup.update({
        title: 'Reset Password',
        [...]
      })
    }
  }
}

I get:

TypeError: this.popup.update is not a function

Is this a bug or am I doing something wrong?

selfagency commented 4 years ago

Actually, I'm incorrect, the last example works, but only with the update method.

avil13 commented 4 years ago

Hi I think it would be more correct. You simply call the function before you define it.

export
default {
    data() {
        return {
            popup: null
        }
    },
    methods: {
        updatePopup() {
            this.popup.update({
                title: 'Reset Password',
                [...]
            })
        }
    },
    mounted() {
        this.popup = this.$swal({
            title: 'Login',
            [...]
        })
    }
}