ant-design / ant-design-pro

👨🏻‍💻👩🏻‍💻 Use Ant Design like a Pro!
https://pro.ant.design
MIT License
36.4k stars 8.14k forks source link

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

Open Howie7793 opened 3 months ago

Howie7793 commented 3 months ago

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

Howie7793 commented 3 months ago

我在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页面。 我需要限制这个路由的跳转,应该怎么做呢

echoyl commented 3 months ago

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