vue中的路由-前置守卫:修改网页标题,后置守卫:设置网页加载状态

// 全局前置守卫
router.beforeEach((to: any, from: any, next: any) => {
    LoadingBar.start();   // 网页加载状态
    console.log(to, from);
    if (to.meta.title) {
        document.title = to.meta.title;
    }
    if (to.name !== from.name) {
        next();
    }
});
// 全局后置钩子
router.afterEach(() => {
    LoadingBar.finish(); // 网页加载状态
    window.scrollTo(0, 0);
});

对应的router.js写法

{
                path: 'potential-customers',
                name: 'customer-potential-customers',
                meta: {
                    title: '客户服务中心-潜在客户'
                },
                component: () => import('../views/customer-service-center/potential-customers/index.vue')
},

你可能感兴趣的:(Vue)