javascriptvue.jsnuxt.jsvuejs3nuxt3.js

@click event not firing on nuxt-link in Nuxt 3


According to this Nuxt 2 stack question this should prevent nuxt-link from navigating to a new page:

<nuxt-link :to="`/meet`" class="group font-normal" @click.native="event => event.preventDefault()" event="">

but it doesn't. The function inside @click is not executed and nuxt navigates to /meet url.

Any idea how to execute @click events on a nuxt 3 link?


Solution

  • Try to use the prevent modifier and remove :to prop:

    <nuxt-link  class="group font-normal" @click.prevent="yourEventHandler" event="">
    

    then use this.$router.push() inside your event handler