Router

用于路由网页页面 所属包名: vue-router

import VueRouter from 'vue-router'
Vue.use(VueRouter) // 全局引用

// 配置路由信息
const config = [
    {
        // 路径
        path: '/',

        // 别名
        name: 'XXX',

        // 显示组件
        // component: XXX,

        // 重定向到指定路径
        // redirect: 'path',
    },
]

// 创建路由器
const router = new VueRouter({
    mode: 'history', // 推荐
    config
})

// 外显
export default router;

拦截器

全局拦截器

访问路由

进入页面前拦截

router.beforeEach((to, from, next) => {
    /*
    to:         当前路由跳转到哪
    from:       当前路由从哪里跳转的
    next:       函数，next()放行，next("path")重定向到path
    */
})

退出路由

退出页面时拦截

router.afterEach((to, from) => {
    /*
    to:         当前路由跳转到哪
    from:       当前路由从哪里来
    */
});

组件拦截器

访问路由

进入该组件前拦截

export default {
    beforeRouterEnter(to, from, next){

    }
}

更新路由

还不清楚具体作用

export default {
    beforeRouterUpdate(to, from, next){

    }
}

退出路由

当即将离开页面时

export default {
    beforeRouterLeave(to, from, next){

    }
}