[Vue]routerview写死渲染成功，动态就渲染失败？

Question

使用的版本是Vue3

背景介绍

我希望为我的路由home动态添加子路由
并通过点击侧栏菜单实现对router-view的渲染

---

问题综述

在图1写死的例子中，可以正确渲染router-view

但是在我写的动态生成的子路由则不能
虽然组件能显示，但是会跳转到一个新页面，而不是在HomeView2组件中被渲染

---

这是我的动态生成子路由的js代码

export const doFormat=function(unFormatRoutes, parentName, router){
    unFormatRoutes.forEach(route => {                
        if(route.name == '所有'){
            return
        }
        let{                    //对应key-value地接收后端JSON中的数据
            path,
            component,
            name,
            meta,
            enabled,
            icon,
            children
        } = route
        if(children && children instanceof Array){    //如果当前的route对象有子菜单，则子菜单递归格式化
            component: () => import('@/views/HomeViewExample.vue');  //先给父路由声明一个随意有效的临时组件，以免addRoute失败
            router.addRoute(route);
            children = doFormat(children, name, router);
        }
        
        var myComponent = () => import('@/components/user/UserList.vue')  //先写死，如果成功渲染就改为动态
        
        let fmtRoute={
            path: path,                                
            name: name,
            icon: icon,
            meta: meta,
            hidden: !enabled,
            children: children,
            component: myComponent
            
        }
        rtnFmtRoutes.push(fmtRoute)
        if(!parentName){
            router.addRoute(fmtRoute)                //父路由
        }else{
            router.addRoute(parentName,fmtRoute)    //子路由
        }
    })
}

---

这是添加完后的getRoutes()方法返回值

截取了一个父菜单一个子菜单

请问为什么会出现动态生成的子路由不渲染的情况。这是我的毕业设计，赶工期间卡住了。实在是自己研究无门，来问一问

Answer 1

能否吧你代码写一份在jsrun 或者 codepen
保证可运行