Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
https://pro.ant.design/zh-CN/docs/advanced-menu
根据该文档的方式实现从模拟服务端请求菜单,返回的菜单中包含设置access 信息,并配置access.ts文件,权限控制无效
© 版本信息 Ant Design Pro 版本: "version": "6.0.0"
app.tsx文件
import { AvatarDropdown, AvatarName, Footer, Question, SelectLang } from '@/components'; import { LinkOutlined } from '@ant-design/icons'; import type { Settings as LayoutSettings } from '@ant-design/pro-components'; import { SettingDrawer } from '@ant-design/pro-components'; import type { RequestConfig, RunTimeLayoutConfig } from '@umijs/max'; import { history, Link } from '@umijs/max'; import defaultSettings from '../config/defaultSettings'; import { errorConfig } from './requestErrorConfig'; import { currentUser as queryCurrentUser } from './services/ant-design-pro/api'; import { createRef } from 'react'; const isDev = process.env.NODE_ENV === 'development'; const loginPath = '/user/login'; /** * @see https://umijs.org/zh-CN/plugins/plugin-initial-state * */ export async function getInitialState(): Promise<{ settings?: Partial<LayoutSettings>; currentUser?: API.CurrentUser; loading?: boolean; fetchUserInfo?: () => Promise<API.CurrentUser | undefined>; }> { const fetchUserInfo = async () => { try { const msg = await queryCurrentUser({ skipErrorHandler: true, }); return msg.data; } catch (error) { history.push(loginPath); } return undefined; }; // 如果不是登录页面,执行 const { location } = history; if (![loginPath, '/user/register', '/user/register-result'].includes(location.pathname)) { const currentUser = await fetchUserInfo(); return { fetchUserInfo, currentUser, settings: defaultSettings as Partial<LayoutSettings>, }; } return { fetchUserInfo, settings: defaultSettings as Partial<LayoutSettings>, }; } // ProLayout 支持的api https://procomponents.ant.design/components/layout export const layout: RunTimeLayoutConfig = ({ initialState, setInitialState }) => { const layoutActionRef = createRef(); return { actionsRender: () => [<Question key="doc" />, <SelectLang key="SelectLang" />], avatarProps: { src: initialState?.currentUser?.avatar, title: <AvatarName />, render: (_, avatarChildren) => { return <AvatarDropdown>{avatarChildren}</AvatarDropdown>; }, }, waterMarkProps: { content: initialState?.currentUser?.name, }, footerRender: () => <Footer />, onPageChange: () => { const { location } = history; // 如果没有登录,重定向到 login if (!initialState?.currentUser && location.pathname !== loginPath) { history.push(loginPath); } }, bgLayoutImgList: [ { src: 'https://mdn.alipayobjects.com/yuyan_qk0oxh/afts/img/D2LWSqNny4sAAAAAAAAAAAAAFl94AQBr', left: 85, bottom: 100, height: '303px', }, { src: 'https://mdn.alipayobjects.com/yuyan_qk0oxh/afts/img/C2TWRpJpiC0AAAAAAAAAAAAAFl94AQBr', bottom: -68, right: -45, height: '303px', }, { src: 'https://mdn.alipayobjects.com/yuyan_qk0oxh/afts/img/F6vSTbj8KpYAAAAAAAAAAAAAFl94AQBr', bottom: 0, left: 0, width: '331px', }, ], links: isDev ? [ <Link key="openapi" to="/umi/plugin/openapi" target="_blank"> <LinkOutlined /> <span>OpenAPI 文档</span> </Link>, ] : [], menuHeaderRender: undefined, // 自定义 403 页面 // unAccessible: <div>unAccessible</div>, // 增加一个 loading 的状态 childrenRender: (children) => { // if (initialState?.loading) return <PageLoading />; return ( <> {children} {isDev && ( <SettingDrawer disableUrlParams enableDarkTheme settings={initialState?.settings} onSettingChange={(settings) => { setInitialState((preInitialState) => ({ ...preInitialState, settings, })); }} /> )} </> ); }, ...initialState?.settings, actionRef: layoutActionRef, menu: { // 每当 initialState?.currentUser?.userid 发生修改时重新执行 request params: { userId: initialState?.currentUser?.userid, }, request: async (params, defaultMenuData) => { // initialState.currentUser 中包含了所有用户信息 //模拟请求返回菜单数据 const menuData = await [...defaultMenuData, { path: '/form', icon: 'form', name: 'form', routes: [ { path: '/form', redirect: '/form/basic-form', }, { name: 'basic-form', icon: 'smile', path: '/form/basic-form', component: './form/basic-form', access: 'normalRouteFilter' }, { name: 'step-form', icon: 'smile', path: '/form/step-form', component: './form/step-form', access: 'normalRouteFilter' }, { name: 'advanced-form', icon: 'smile', path: '/form/advanced-form', component: './form/advanced-form', }, ], }, ]; return menuData; }, onLoadingChange: (loading: boolean) => { if (!loading) { setInitialState((preInitialState: any) => ({ ...preInitialState, loading: false, })); } } } }; }; /** * @name request 配置,可以配置错误处理 * 它基于 axios 和 ahooks 的 useRequest 提供了一套统一的网络请求和错误处理方案。 * @doc https://umijs.org/docs/max/request#配置 */ export const request: RequestConfig = { baseURL: 'https://proapi.azurewebsites.net', ...errorConfig, };
access.ts 文件
export default function access(initialState: { currentUser?: API.CurrentUser } | undefined) { const { currentUser } = initialState ?? {}; return { canAdmin: currentUser && currentUser.access === 'admin', normalRouteFilter: false }; }
该菜单没有隐藏及显示403
The text was updated successfully, but these errors were encountered:
各位大神有解决的办法吗? 贴个示例瞧瞧,感谢!
这框架还能用不~,社区没人气啊
他这个动态菜单好像没啥用,所有路由及权限需要预先定义好。动态菜单改也就只能改个节点名字,其他都有使用限制
我也是这个问题,request在校验access之后所以就失效了,感觉要是request获取到access对象也是可以的但是好像不行
https://pro.ant.design/zh-CN/docs/advanced-menu
根据该文档的方式实现从模拟服务端请求菜单,返回的菜单中包含设置access 信息,并配置access.ts文件,权限控制无效
© 版本信息
Ant Design Pro 版本: "version": "6.0.0"
app.tsx文件
access.ts 文件
该菜单没有隐藏及显示403
![image](https://cdn.statically.io/img/private-user-images.githubusercontent.com/6469431/299225451-84e98578-3eb3-4676-b580-9f036f45c382.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjEzOTk4MzMsIm5iZiI6MTcyMTM5OTUzMywicGF0aCI6Ii82NDY5NDMxLzI5OTIyNTQ1MS04NGU5ODU3OC0zZWIzLTQ2NzYtYjU4MC05ZjAzNmY0NWMzODIucG5nP1gtQW16LUFsZ29yaXRobT1BV1M0LUhNQUMtU0hBMjU2JlgtQW16LUNyZWRlbnRpYWw9QUtJQVZDT0RZTFNBNTNQUUs0WkElMkYyMDI0MDcxOSUyRnVzLWVhc3QtMSUyRnMzJTJGYXdzNF9yZXF1ZXN0JlgtQW16LURhdGU9MjAyNDA3MTlUMTQzMjEzWiZYLUFtei1FeHBpcmVzPTMwMCZYLUFtei1TaWduYXR1cmU9ZGIyMzQ1MTBmZGI5ZDY0ZTdkOTQzMDZjOTc1MWZlNjFhYjc0OTI2ZTlkNjIzZDI4ZGUzMWM1ZDU0NjFjYjFiNSZYLUFtei1TaWduZWRIZWFkZXJzPWhvc3QmYWN0b3JfaWQ9MCZrZXlfaWQ9MCZyZXBvX2lkPTAifQ.2IplEl2Y4E0ZJxY93u1aXft_40T6SgK1P7tw6TysZCY)
The text was updated successfully, but these errors were encountered: