Vue - Can´t call sweetalert2 inside method

Question

I have problem launching sweetalert inside a vue methods. If i call the sweetalert directly in the script works, but when i want to launch sweetalert when click a button nothing happens (no errors in console). The code looks

Vue (Vuetify)

 <v-card-actions>
                <v-btn block dark @submit="submit()">Entrar</v-btn>
              </v-card-actions>

This work

 <script>
    Swal.fire({
      title: "Error!",
      text: "Do you want to continue",
      icon: "error",
      confirmButtonText: "Cool"
    });

  </script>

Not work

 <script>
    export default {
      data() {
        return {
          value: String,
          name: "",
          password: ""
        };
      },
      methods: {
        submit() {
          Swal.fire({
            title: "Error!",
            text: "Do you want to continue",
            icon: "error",
            confirmButtonText: "Cool"
          });
        }
      }
    };
    </script>

I´m new in Vue so maybe the error is easy to see but i don´t know why no works.

So question is: Why can´t launch sweetalert modal when i click a button?

Answer 1

Try @click instead of @submit

<v-btn block dark @click="submit()">Entrar</v-btn>