ant-design / ant-design/pro-components
🧐[问题]使用umi/max+pro-layout动态菜单功能,服务端下发菜单列表,请问有什么api是获取服务端下发后的当前页面的路由信息
- Dominant language
- TypeScript
- Stars
- 4.8k
- Forks
- 1.4k
- Avg merge
- 10h 44m
- Merged PRs (30d)
- 3
Description
### 🧐 问题描述
简而言之:想要获取这个菜单的路由数据

这个是服务器下发的菜单格式
```
{
"id": "20",
"menuNames": {
"en": "test json"
},
"parentId": "0",
"orderNum": 0,
"path": "/json",
"svrPath": "",
"menuType": "C",
"disabled": 0,
"perms": "",
"hideChildrenInMenu": 0,
"hideInMenu": 0,
"icon": "",
"menuKey": "",
"parentKeys": "",
"flatMenu": 0,
"pageSchema": "",
"pageType": "J",
"component": "",
"customizeConfig": "",
"createBy": "108",
"updateBy": "1",
"createdAt": "1727661405",
"updatedAt": "1727664346",
"remark": "",
"children": [],
"name": "test json"
}
```
使用umi的getRouteData和getRouteProps拿到的是
```
{
"path": "/json",
"title": "json页面",
"parentId": "ant-design-pro-layout",
"id": "8",
"locale": "json页面"
}
```
umi获取到的并不是想要的,getMenuData又好像不是用来获取这信息的,理想的是获取到上面的格式(在app.ts -> layout -> menu -> request请求获取到的),请问有什么方法吗
### 💻 代码示例
```
export const layout = ({
initialState,
}: {
initialState: { permissions: string[]; user: TYPE.User; roles: TYPE.Role[] };
}) => {
return {
logo: '/favicon.png',
menu: {
locale: false,
request: async (_: any, defaultMenuData: MenuDataItem[]) => {
const { roles } = initialState;
let menu = [];
const baseRoutes = defaultMenuData.filter((route) => route.resident);
const adminRoutes = defaultMenuData.filter((route) => route.needAdmin);
try {
const { data } = await getUserMenu();
menu = toCamelCase(data);
if (roles.find((role) => role.role_key === 'admin')) {
menu = [...baseRoutes, ...adminRoutes, ...menu];
} else {
menu = [...baseRoutes, ...menu];
}
menu = fmtMenuName(menu);
} catch (err) {
console.log('err', err);
menu = [];
}
console.log('当前账号的菜单权限列表:', menu);
return menu;
},
},
};
```
Contributor guide
Research direction
Start in app.ts at the layout.menu.request callback, then review how getRouteData, getRouteProps, and getMenuData expose menu information. Determine whether the server response can be accessed through an existing entry point or whether a new API is needed; done requires a documented, supported way to retrieve the requested server-provided menu data.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100