路由无法正常跳转

来源:1-1 导学

幕布斯9172251

2022-02-02

老师:
过年好,我核对了路由表里的信息没问题,但输入路由地址却无法跳转,麻烦您帮忙看看,谢谢!
图片描述
import { createRouter, createWebHistory, RouteRecordRaw } from “vue-router”;
import layout from ‘@/layout/index.vue’;

/**

  • 私有路由表
    /
    const privateRoutes = [
    {
    path:’/user’,
    component:layout,
    redirect:’/user/manage’,
    meta:{
    title:‘user’,
    icon:‘personnel’
    },
    children:[
    {
    path:’/user/manage’,
    name:‘userManage’,
    component: () => import(’@/views/user-manage/index.vue’),
    meta: {
    title:‘userManage’,
    icon:‘personnel-manage’
    }
    },
    {
    path:’/user/role’,
    name:‘userRole’,
    component: () => import(’@/views/role-list/index.vue’),
    meta: {
    title:‘roleList’,
    icon:‘role’
    }
    },
    {
    path:’/user/permission’,
    name:‘userPermission’,
    component: () => import(’@/views/permission-list/index.vue’),
    meta: {
    title:‘permissionList’,
    icon:‘permission’
    }
    },
    // {
    // path:’/user/info/:id’,
    // name:‘userInfo’,
    // component: () => import(’@/views/user-info/index.vue’),
    // meta: {
    // title:‘userInfo’
    // }
    // },
    {
    path:’/user/import’,
    name:‘import’,
    component: () => import(’@/views/import/index.vue’),
    meta: {
    title:‘excelImport’
    }
    },
    ]
    },
    {
    path: ‘/article’,
    component: layout,
    redirect: ‘/article/ranking’,
    name: ‘articleRanking’,
    meta: { title: ‘article’, icon: ‘article’ },
    children: [
    {
    path: ‘/article/ranking’,
    name:‘acticleRanking’,
    component: () => import(’@/views/article-ranking/index.vue’),
    meta: {
    title: ‘articleRanking’,
    icon: ‘article-ranking’
    }
    },
    {
    path: ‘/article/:id’,
    name:‘articleDetail’,
    component: () => import(’@/views/article-detail/index.vue’),
    meta: {
    title: ‘articleDetail’
    }
    },
    {
    path: ‘/article/create’,
    name:‘acticleCreate’,
    component: () => import(’@/views/article-create/index.vue’),
    meta: {
    title: ‘articleCreate’,
    icon: ‘article-create’
    }
    },
    {
    path: ‘/article/editor/:id’,
    name:‘articleEditor’,
    component: () => import(’@/views/article-detail/index.vue’),
    meta: {
    title: ‘articleDetail’
    }
    },
    ]
    },
    ]
    /
    *
  • 公开路由表
    */
    const publicRoutes: Array = [
    {
    path:’/login’,
    name:‘Login’,
    component:() => import(’@/views/login/index.vue’)
    },{
    path:’/’,
    redirect:’/profile’,
    component: layout,
    children:[
    // 个人中心
    {
    path:’/profile’,
    name:‘profile’,
    component: () => import(’@/views/profile/index.vue’),
    meta: {
    title:‘profile’,
    icon:‘el-icon-user’
    }
    },
    // 404
    {
    path:’/404’,
    name:‘404’,
    component: () => import(’@/views/error-page/404.vue’)
    },
    // 401
    {
    path:’/401’,
    name:‘401’,
    component: () => import(’@/views/error-page/401.vue’)
    },
    ]
    }
    ];

const router = createRouter({
history: createWebHistory(),
routes:[…publicRoutes,…privateRoutes],
});

export default router;

写回答

1回答

Sunday

2022-02-02

你好,新年快乐

我查看你的贴图有一个对应的错误: invalid navigation guard

这个错误应该是导航守卫中的错误,你可以查看下这个帖子,看看能不能解决你的问题:

https://stackoverflow.com/questions/62223195/vue-router-uncaught-in-promise-error-redirected-from-login-to-via-a

0
0

基于Vue3新标准,打造后台综合解决方案

基于Vue3重写Vue-element-admin,打造后台前端综合解决方案

1941 学习 · 1687 问题

查看课程