antd ProLayout 组件 - 从服务器获取菜单数据

Question

我正在使用 UmiJs 进行配置，并且我想添加从 API 获取的路由。

我的问题是数据太多，正在应用的其他部分使用，并且将来可能会发生变化。因此，为了避免每次发生更改时手动更新菜单数据，我想从服务器获取它们并将它们映射到路由配置。

路由具有名称、路径和组件等属性。这些数据将作为 Ant Design Pro Layout 的参考，并在我运行项目时显示在菜单中。

当我正常添加路由时它可以工作，例如：

routes: [
  {
    name: 'sampleName',
    path: 'samplePath',
    component: 'SampleComponent',
  }
]

但是当我从 API 获取数据时它不起作用，例如：

routes: [...fetchRoutesData()] //fetchRoutesData contains an httpRequest and returns an array of routes object.

这可能吗？或者有没有办法让我确保 fetchRoutesData() 在应用程序使用配置之前完成？ （我已经在这里尝试过异步等待，但仍然没有在菜单中显示来自 API 的路由数据）

提前谢谢你。

Answer 1

我已经通过使用 UmiJS 功能 patchRoutes 和渲染（覆盖默认渲染）解决了这个问题，它们应该放在 src/apps.ts 中。