vue admin element动态路由刷新后白屏

vue admin element框架配置动态路由后 点击左边的菜单栏可以正常访问到 但是一刷新页面就变成空白的了 一直苦思不得其解 刚刚终于让我查到了！！！
那就是修改 src/router/index.js 的时候 { path: '*', redirect: '/404', hidden: true } 要放在动态路由列表的最后一行也就是 asyncRoutes 列表里，不能放在原来静态路由的位置。因为静态路由后面是接动态路由的，404放静态的最后一个会陷入死循环

export const constantRoutes = [
    {
        path: '/login',
        component: () => import('@/views/login/index'),
        hidden: true
    },


    {
        path: '/',
        component: Layout,
        redirect: '/booking_list',
        alwaysShow: true,
        name: '预约管理',
        roles: ['admin', 'booking'],
        meta: { title: '预约管理', enTitle: 'Booking list' },
        children: [
            {
                path: 'booking_list',
                name: '预约管理',
                component: () => import('@/views/booking/booking_list'),
                meta: { title: '预约管理', enTitle: 'Booking list' }
            },

        ]
    },
    //就是这里 要注释掉！！！！
        // { path: '*', redirect: '/404', hidden: true }
]

export const asyncRoutes = [    {
        path: '/Admin',
        component: Layout,
        redirect: '/Admin',
        name: '系统设置',
        meta: {
            title: '系统设置',
            enTitle: 'Admin'
        },
        children: [
            {
                path: '/personel_management',
                name: '人员管理',
                component: () => import('@/views/admin/personel_management'),
                meta: { title: '人员管理', enTitle: 'Personel Management', roles: ['admin', 'authorily'] }
            },

            {
                path: '/error_log',
                name: '系统消息',
                component: () => import('@/views/admin/error_log'),
                meta: { title: '系统消息', enTitle: 'Messaging Log', roles: ['admin'] }
            }
        ]
    },
    { path: '*', redirect: '/404', hidden: true }
]

记录一下 困扰了好几天o(╥﹏╥)o
看来还是要仔细研读源码 要不就会这样 知其然不知其所以然o(╥﹏╥)o