ant-design / ant-design/pro-components

🧐[问题]使用umi/max+pro-layout动态菜单功能,服务端下发菜单列表,请问有什么api是获取服务端下发后的当前页面的路由信息

Open
#8,751 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
4.8k
Forks
1.4k
Avg merge
10h 44m
Merged PRs (30d)
3

Description

### 🧐 问题描述

简而言之:想要获取这个菜单的路由数据
![image](https://github.com/user-attachments/assets/632652ba-8ac4-499f-a380-0e723f60c544)

这个是服务器下发的菜单格式
```
{
"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

Open the contributing 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

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.