成都开发网站建设wordpress评论回复邮箱

router.beforeEach()是Vue.js中的路由守卫，用于在路由跳转前进行校验、取消、重定向等操作。

基本使用：

const router = new VueRouter({ ... })router.beforeEach((to, from, next) => {// ...
})

to: 即将要进入的目标路由对象

from: 当前导航正要离开的路由

next: 必须调用该方法来 resolve 这个钩子。它接受三个参数：

true: 进行管道中的下一个钩子，如果全部钩子完成，则导航会被确认。

false: 中断当前的导航。如果目标路由是一个重定向，那么会跳转到重新定向的路由。

(path|route object): 进行一个新的导航到一个不同的地址，这时候需要提供一个路径或者一个路由对象。

实例代码：

router.beforeEach((to, from, next) => {if (to.matched.some(record => record.meta.requiresAuth) && !isAuthenticated) {next({ path: '/login', query: { redirect: to.fullPath }})} else {next()}
})

这个例子中，如果用户没有登录，并且目标路由需要认证，那么用户会被重定向到登录页面，并且登录完成后会被重定向到原先想要访问的页面。

使用next传递参数：

router.beforeEach((to, from, next) => {if (to.matched.some(record => record.meta.requiresAuth) && !isAuthenticated) {next({ path: '/login', query: { redirect: to.fullPath }})} else {next()}
})

在这个例子中，如果用户尝试访问一个需要认证的页面，但是没有认证，那么用户会被重定向到登录页面，并且带上原先想要访问的页面的路径。

使用next(false)取消导航：

router.beforeEach((to, from, next) => {if (to.name !== 'Login' && !isAuthenticated) {next(false)} else {next()}
})

在这个例子中，如果用户没有登录，并且尝试访问非登录页面，则会取消当前的导航。

使用next('/path')进行重定向：

router.beforeEach((to, from, next) => {if (to.name === 'Admin') {next('/home')} else {next()}
})

在这个例子中，如果用户尝试访问名为'Admin'的页面，则会被重定向到'/home'。

以上就是关于router.beforeEach()的几种常见用法，它是Vue.js路由守卫中的一个重要部分，可以用于处理各种路由守卫的需求。