vue-router4 中router-link，tag（v3）相关应用

在vue-router 3.x中，router-link标签中会被渲染为a标签，实际应用中，有可能需要将a标签改为其它标签

可以使用tag="button"这种方式，

但是在vue-router 4.x中，移除了tag，为了实现这样的效果，

?

1 2 3

<router-link to="/home" custom v-slot="{ isActive,isExactActive,navigate }">   <button  @click="navigate" :class="{'router-link-active':isActive}">首页</button> </router-link>

　官方文档；

https://router.vuejs.org/guide/migration/#removal-of-append-prop-in-router-link

https://router.vuejs.org/api/#router-link-s-v-slot

 

其中如果需要 将a标签去掉，则需要加上custon属性

官方文档：https://router.vuejs.org/api/#custom