基于antd_pro 2版本进行开发
首先:在models/menu中发起请求
export default {
namespace: 'menu',
state: {
menuData: [],
breadcrumbNameMap: {},
},
effects: {
*getMenuData({ payload }, { put }) {
const { routes, authority } = payload;
const menuData = filterMenuData(memoizeOneFormatter(routes, authority));
const breadcrumbNameMap = memoizeOneGetBreadcrumbNameMap(menuData);
console.log(menuData,'*****')
console.log(breadcrumbNameMap,'scd**')
yield put({
type: 'save',
payload: { menuData, breadcrumbNameMap },
});
},
},
reducers: {
save(state, action) {
return {
...state,
...action.payload,
};
},
},
};
####其次:在src/layouts/BasicLayout.js 中调用,进行数据处理
componentDidMount() {
const {
dispatch,
route: { routes, path, authority },
} = this.props;
dispatch({
type: 'menu/getMenuData',
payload: { routes, path, authority },
});
}
render() {
const {
menuData,
} = this.props;
const isTop = PropsLayout === 'topmenu';
const layout = (
<Layout>
{isTop && !isMobile ? null : (
<SiderMenu
logo={logo}
theme={navTheme}
onCollapse={this.handleMenuCollapse}
menuData={menuData}
isMobile={isMobile}
{...this.props}
/>
)}
<Layout
style={{
...this.getLayoutStyle(),
minHeight: '100vh',
}}
>
<Header
menuData={menuData}
handleMenuCollapse={this.handleMenuCollapse}
logo={logo}
isMobile={isMobile}
{...this.props}
/>
<Content style={this.getContentStyle()}>
<Authorized
authority={this.getPageAuthority(pathname, breadcrumbNameMap)}
noMatch={<Exception403 />}
>
{children}
</Authorized>
</Content>
<Footer />
</Layout>
</Layout>
);
return (
<React.Fragment>
<DocumentTitle title={this.getPageTitle(pathname, breadcrumbNameMap)}>
<ContainerQuery query={query}>
{params => (
<Context.Provider value={this.getContext()}>
<div className={classNames(params)}>{layout}</div>
</Context.Provider>
)}
</ContainerQuery>
</DocumentTitle>
<Suspense fallback={<PageLoading />}>{this.renderSettingDrawer()}</Suspense>
</React.Fragment>
);
}
}