vue在路由中验证token是否存在的简单实现

1.在router/index.js进行验证2.代码如下：importVuefrom'vue'importRouterfrom'vue-router'importLoginfrom'@/compone

1. 在router/index.js进行验证

2. 代码如下：

import Vue from 'vue'
import Router from 'vue-router'
import Login from '@/components/common/Login';
......

Vue.use(Router)
const router = new Router({
 routes: [{
 path: '/',
 name: Login,
 component: Login,
 },
 {
 path: '/home',
 component: Home,
 meta: { 
 requiresAuth: true // 要求验证的页面,在此情况下其子页面也会被验证.
 },
 children: [{
 path: '/paChong',
 name: 'PaChong',
 component: PaChong
 }
 ]
 }
 ]
})
router.beforeEach((to, from, next) => {
 if (to.matched.some(record => record.meta.requiresAuth)) { // 哪些需要验证
 if (!sessionStorage.getItem("token")) { // token存在条件 
 next({
 path: '/', // 验证失败要跳转的页面
 query: {
 redirect: to.fullPath // 要传的参数
 }
 })
 } else {
 next()
 }
 } else {
 next() // 确保一定要调用 next()
 }
})

export default router

以上这篇vue在路由中验证token是否存在的简单实现就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。