ant-design-pro icon indicating copy to clipboard operation
ant-design-pro copied to clipboard

🧐[问题 | question] 如何做动态路由

Open Howie7793 opened this issue 1 year ago • 4 comments
trafficstars

请问下,我使用的ant-design-pro,直接下载下来后没有进行任何修改。 现在是登录admin和user左侧的菜单是不同的。 我现在想要用我登录后响应的用户信息中的pages信息,来筛选过滤动态生成路由页面,请问应该怎么做呢,有不修改框架模板的基础上,简单的修改方法嘛?

Howie7793 avatar Jun 11 '24 10:06 Howie7793

我在app.tsx中,layout中添加 menu: { params: { userId: initialState?.currentUser?.userid, }, request: async (params, defaultMenuData) => { console.log('重新获取菜单数据');

    // initialState.currentUser 中包含了所有用户信息
    const menuData = await getMenuTestApi();
    console.log('menuData', menuData);

    return menuData;
  },
},

这样左侧的菜单是可以根据请求控制的了,但是路由并没有限制掉,例如数据中没有A页面,我可以通过url后面直接输入A进而进入A页面。 我需要限制这个路由的跳转,应该怎么做呢

Howie7793 avatar Jun 12 '24 01:06 Howie7793

你说的应该是 access.ts 里面的权限检测。后端请求了菜单应该在后端就根据用户角色将没有权限的菜单不要返回过来

echoyl avatar Jun 12 '24 01:06 echoyl

目前纯后端接口的做不了

可以参照:

1.文档:菜单的高级用法 注意看:

从服务端请求菜单

服务端获取的菜单重定向不生效且 icon 不会自动转化。重定向需要配置在路由中才会生效。 icon 需要手工映射

2.下面issue也有帮助的

ISSUE:https://github.com/ant-design/ant-design-pro/issues/10988

canren avatar Oct 25 '24 03:10 canren

想不明白,这个这么重要的功能,墨迹几年了

zhiming429438709 avatar Dec 05 '24 06:12 zhiming429438709