vue-router 鉴权 守卫

导航守卫

使用 在创建router实例的地方

全局守卫

import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)
const router = new VueRouter({
    mode:'history', // 路由模式 hash history abstract
    routes:[
        {
            path:'/index',
            name:'index',
            component:()=>import('@/components/Head'),
            meta:{ // 元数据（描述数据的数据）
                title:'index'
            }
        }
    ]
})

// 前置守卫：路由跳转之前
// to 要进入的路由
// from 从那个路由过来的
router.beforeEach((to, form, next)=>{
    /* 必须调用 `next` */
    // 动态修改网页标题
    document.title = to.matched[0].meta.title
    next()
})

// 全局解析守卫: 同时在所有组件内守卫和异步路由组件被解