Click event in router-link - Stack Overflow

Question

<li :class="{active: show === 'daily'}">
  <router-link @click="displayArticle('hot')" to="/home/article">日报</router-link> 
</li>

Why does it have no effect if I write it like the above, but I can change it to the following one? router-link Can't events be bound to tags?

<li :class="{active: show === 'hot'}" @click="displayArticle('hot')">
  <router-link  to="/home/article">热门</router-link>  
</li>

Answer 1

router-link will prevent click events

You can only use @click.native="displayArticle('hot')" in router-link

Generally do not add it to router-link

Answer 2

To bind native events to custom components, you need to add the .nativemodifier document portal