vue3后台动态添加路由刷新出现404页面

 学习心得

动态添加路由是权限管理中的一个要点，通过获取角色权限，展示对应的权限菜单。

vue3中利用 addRoute() 方法动态添加路由  如果需要添加嵌套路由的话需要用到上一级的组件name属性，需提前定义好。
如要给admin添加子级路由，就要用addRoute('admin',item)
使用动态路由添加的路由，手动使用router.push() 或者

用动态路由添加的路由，手动使用router.push() 或者router.replace() 跳转是没有问题的，但如果通过路径跳转就会出现页面丢失
需要手动来指定跳转路径  可以在router.beforeEach之前定义一个变量flag为false，在添加动态路由之前对flag进行判断，当flag为false时通过，即!flag，在动态添加完路由之后将他设置为true，并且用next(to.path)来手动指定跳转，然后会因为是手动进入指定页面，并不会刷新flag，所以会在下一个else中放行

        if (!isRefresh) {
            //获取权限菜单
            let {
                menus
            } = await store.dispatch('getInfo')
            //动态添加路由
            addRoutes(menus)   
            isRefresh = true
            //添加完动态路由后，手动指定跳转
            next(to.path)
        } else {
            //让刷新之后的路由跳转通过
            next()
        }