Vue3 中常见的路由跳转方式有三种:
1. 声明式导航
在 Vue3 中,可以通过 router-link 标签实现声明式的导航,即在模板中直接使用指令 v-link 或者是组件 router-link。这种方式会根据传入的参数自动构造正确的 URL,并使用 HTML5 History API (pushState/replaceState) 方式进行导航。
2. 编程式导航
也可以使用编程式的导航方式,在 Vue3 中,可以通过 $router 对象提供的方法进行跳转。包括 push、replace、go 等方法。
例如,在组件内部使用 $router.push('/path') 可以进行跳转。
3. 导航守卫
还可以通过导航守卫来控制路由跳转,导航守卫可以在路由跳转的过程中进行钩子函数的拦截,从而控制进入或离开某个路由的行为。
react router v6路由守卫在 Vue3 中,常见的路由守卫有:beforeEach、beforeResolve 和 afterEach。这三种守卫可以分别对应路由导航前、解析完成时和路由导航后三个不同的时间点。
总之,以上三种方式都可以用来实现 Vue3 的路由跳转,具体选择哪种方式取决于具体场景和需求。