Vue中的beforeEach和afterEach全局导航守卫如何实现长尾词功能？

本文共计925个文字，预计阅读时间需要4分钟。

目录+全局导航守卫（beforeEach、afterEach）+导航钩子有3个参数+beforeEach+afterEach+全局导航守卫是什么？

1. 在router的index.js文件中引入vue-router

2.创建路由实例

3.挂载全局导航守卫

4.全局导航守卫是做什么的？

目录

• 全局导航守卫(beforeEach、afterEach)
• 导航钩子有3个参数
• beforeEach
• afterEach
• 全局导航守卫是干什么的？
• 1.在router中的index.js文件里引入vue-router
• 2.创建路由实例
• 3.挂载全局导航守卫

全局导航守卫(beforeEach、afterEach)

在项目开发中每一次路由的切换或者页面的刷新都需要判断用户是否已经登录，前端可以判断，后端也会进行判断的，我们前端最好也进行判断。

vue-router 提供了导航钩子:全局前置导航钩子 beforeEach 和全局后置导航钩子 afterEach，他们会在路由即将改变前和改变后进行触发。所以判断用户是否登录需要在 beforeEach 导航钩子中进行判断。