vue导航守卫有哪些

在 Vue.js 中，导航守卫是一组函数钩子，用于控制路由跳转的行为。Vue.js 提供了三种导航守卫：

1. 全局导航守卫：作用于整个应用程序，用于拦截和处理所有路由跳转。

   • beforeEach(to, from, next)：在路由跳转之前执行，可以用于进行权限验证、登录检查等操作。如果要继续路由跳转，必须调用 next() 函数。

   • afterEach(to, from)：在路由跳转后执行，可以用于页面切换后的一些操作。

   • beforeResolve(to, from, next)：在路由被确认之前，对异步组件进行解析时执行，可以用于等待异步组件加载完成。

2. 路由独享的导航守卫：只作用于某个路由，用于特定的路由跳转控制。

   • beforeEnter(to, from, next)：作用于单个路由，和全局前置守卫的作用一样，但只作用于当前路由。

3. 组件内的导航守卫：只作用于某个组件，用于控制某个组件内的路由跳转。

   • beforeRouteEnter(to, from, next)：在路由进入该组件的对应路由时执行，但是此时该组件实例还未被创建，无法访问组件实例和组件内部的数据。

   • beforeRouteUpdate(to, from, next)：在当前路由更新但是该组件被复用时调用，可以访问组件实例和组件内部的数据。

   • beforeRouteLeave(to, from, next)：在离开当前组件对应的路由时执行，用于确认是否离开该页面、保存浏览状态等操作。

以上就是 Vue.js 中的导航守卫总结。不同类型的导航守卫都有其特定的作用场景，我们可以根据实际需要，选择适合的方式来控制路由跳转的行为。