router-link 上绑定点击事件，不是路由失效就是点击抢道的问题
来源：3-11 侦测变化 - watch
萨龙龙
2020-11-08
在使用 watch 来侦测路由变化时，来显示不同的标题，代码和课程中的差不多：
<router-link to="/foo" @click.native="centerClick('foo')">Go to Foo</router-link>
<router-link to="/bar" @click.native="centerClick('bar')">Go to Bar</router-link>
const centerTitle = Vue.ref('')
// 点击链接切换
const centerClick = (item: string) => {
centerTitle.value = item
}
Vue.watch(centerTitle, () => {
document.title = centerTitle.value
})
添加了点击后，路由失效了。在点击事件上添加了 native 时没有阻止链接跳转，路由也无效，使用 prevent 是可以阻止点击事件，点击有效，但路由还是无效。
请问题各位老师和同学，需要如何解决？
非常感谢！
写回答
2回答
-
.native 修饰符已经deprecated，也就是说已经被废除了。可以看这个问答。https://github.com/vuejs/vue-router/issues/800
现在可以使用子标签的形式，把事件绑定在子标签上面。
<router-link to="/signup"><span @click="test">The Link </span></router-link>
012020-11-10 -
张轩
2020-11-08
同学你好 请问你最终要什么样的效果 是先修改页面的 title，然后再跳转链接 是吗？
012020-11-08
相似问题