请问ice3.0配置路由有支持动态下发的方案吗？

[donfo]

ice2.0的router可以在modifyRoutes方法里从后端请求路由及配置回来，路由的component通过字符串映射组件的方式直接使用。

请问3.0如何处理？

[ClarkXia]

参考 #5970

[donfo]

已经尝试过上面这个方案了，当复杂的场景达不到实际routers的config配置的效果。比如多层嵌套路由的缓存问题，还有路由都配置成动态规则/:route1/:route2，如果下发的路由有多个如/a/1，/c/d，想根据route的path判断高亮菜单也没法做。

[ClarkXia]

你可以 mock 一份路由配置数据，我们尝试写一个 demo 出来

[donfo]

类似下面这种，路由配置从后端返回，"component": "SchemaForm"会指向同一个页面组件来动态渲染页面。在SchemaForm组件里需要拿到当前匹配路由的配置信息再通过如：path去服务端拿页面表单配置来渲染页面。

[{
        "component": "SchemaForm",
        "path": "/cloud/manage/system/tree",
        "exact": false,
        "name": "租户管理-左侧树",
        "children": [{
            "component": "SchemaForm",
            "path": "/cloud/manage/system/tree/tenant_list",
            "exact": false,
            "name": "租户列表"
        }]
    },
    {
        "component": "SchemaForm",
        "path": "/cloud/manage/system/:tenantId/config",
        "exact": false,
        "name": "租户配置中心",
        "children": [{
            "component": "SchemaForm",
            "path": "/cloud/manage/system/:tenantId/config/base",
            "exact": true,
            "name": "基础设置"
        }]
    },
    {
        "component": "SchemaForm",
        "path": "/cloud/manage/system/biz",
        "exact": false,
        "name": "业务管理",
        "children": [{
            "component": "SchemaForm",
            "path": "/cloud/manage/system/biz/add_business",
            "exact": true,
            "name": "创建(编辑)业务"
        }]
    },
    {
        "component": "SchemaForm",
        "path": "/cloud/manage/tenant/tree",
        "exact": false,
        "name": "组织架构树",
        "children": [{
                "component": "SchemaForm",
                "path": "/cloud/manage/tenant/tree/tenant_tab",
                "exact": false,
                "name": "租户管理tab"
            },
            {
                "component": "SchemaForm",
                "path": "/cloud/manage/tenant/tree/list_edu_org",
                "exact": false,
                "name": "组织架构列表",
                "children": [{
                        "component": "SchemaForm",
                        "path": "/cloud/manage/tenant/tree/list_edu_org/list_unit_manager",
                        "exact": true,
                        "name": "单位管理员"
                    },
                    {
                        "component": "SchemaForm",
                        "path": "/cloud/manage/tenant/tree/list_edu_org/org_framework_adjust",
                        "exact": true,
                        "name": "单位调整"
                    }
                ]
            },
            {
                "component": "SchemaForm",
                "path": "/cloud/manage/tenant/tree/list_org_mem",
                "exact": false,
                "name": "组织人员列表",
                "children": [{
                        "component": "SchemaForm",
                        "path": "/cloud/manage/tenant/tree/list_org_mem/add_org_user",
                        "exact": true,
                        "name": "添加-单位用户"
                    },
                    {
                        "component": "SchemaForm",
                        "path": "/cloud/manage/tenant/tree/list_org_mem/update_org_user",
                        "exact": true,
                        "name": "编辑-单位用户"
                    },
                    {
                        "component": "SchemaForm",
                        "path": "/cloud/manage/tenant/tree/list_org_mem/change_org_user",
                        "exact": true,
                        "name": "组织变更-单位用户"
                    },
                    {
                        "component": "SchemaForm",
                        "path": "/cloud/manage/tenant/tree/list_org_mem/set_role",
                        "exact": true,
                        "name": "设置角色"
                    },
                    {
                        "component": "SchemaForm",
                        "path": "/cloud/manage/tenant/tree/list_org_mem/leave_mem",
                        "exact": true,
                        "name": "移除学员"
                    },
                    {
                        "component": "SchemaForm",
                        "path": "/cloud/manage/tenant/tree/list_org_mem/stu_batch_change",
                        "exact": true,
                        "name": "学员批量调整"
                    },
                    {
                        "component": "SchemaForm",
                        "path": "/cloud/manage/tenant/tree/list_org_mem/stu_excel_import",
                        "exact": true,
                        "name": "学员导入"
                    },
                    {
                        "component": "SchemaForm",
                        "path": "/cloud/manage/tenant/tree/list_org_mem/stu_batch_change",
                        "exact": true,
                        "name": "学员批量调整"
                    }
                ]
            }
        ]
    },
    {
        "component": "SchemaForm",
        "path": "/cloud/manage/tenant/:tenantId/:bizCode/role_tree",
        "exact": false,
        "name": "角色管理树",
        "children": [{
                "component": "SchemaForm",
                "path": "/cloud/manage/tenant/:tenantId/:bizCode/role_tree/add_role",
                "exact": true,
                "name": "添加(编辑)角色"
            },
            {
                "component": "SchemaForm",
                "path": "/cloud/manage/tenant/:tenantId/:bizCode/role_tree/role_org_tree",
                "exact": false,
                "name": "组织树",
                "children": [{
                    "component": "SchemaForm",
                    "path": "/cloud/manage/tenant/:tenantId/:bizCode/role_tree/role_org_tree/user_list",
                    "exact": false,
                    "name": "角色用户",
                    "children": [{
                            "id": "cl411mvjt33948svbq3ac12iz",
                            "path": "/cloud/manage/tenant/:tenantId/:bizCode/role_tree/role_org_tree/user_list/add_role_user",
                            "exact": true,
                            "name": "新增角色用户"
                        },
                        {
                            "id": "cl7ga9bjn339590isgr1zavwu8",
                            "path": "/cloud/manage/tenant/:tenantId/:bizCode/role_tree/role_org_tree/user_list/user_selector",
                            "exact": true,
                            "name": "成员选择器"
                        }
                    ]
                }]
            },
            {
                "component": "SchemaForm",
                "path": "/cloud/manage/tenant/:tenantId/:bizCode/role_tree/permission",
                "exact": false,
                "name": "权限配置"
            }
        ]
    }
]

[ClarkXia]

结构上有点复杂，可以尝试新建一个 src/pages/*.ts 来劫持路由，内部通过 Route（直接从 react-router-dom 导入）的方式重新组织路由，参考 https://reactrouter.com/en/main/route/route#index