🧐[问题]如何为ProLayout的左侧菜单区域下,增加自定义的区域内容。
ferris001 opened this issue · comments
🧐 问题描述
我希望定制ProLayout,把自定义的内容插入到左侧菜单区域的下面区域。
根据ProLayout文档,尝试自定义menuRender
来实现。代码片段如下:
export default function Layout() {
const { clientRoutes } = useAppData();
const location = useLocation();
return (
<ProLayout
route={clientRoutes[0]}
location={location}
title="Umi x Ant Design"
layout="side"
menuRender={(menuProps, defaultDom) => (
<div>
{defaultDom}
<div >
自定义内容
</div>
</div>
)}
>
<Outlet />
</ProLayout>
);
}
运行结果是在Menu区域下,并没有出现“自定义内容”。如图:
我的疑问是,上面的代码有什么问题?应该要如何自定义menuRender
来实现需求?
谢谢回复。
我了解ProLayout可以自定义 menuFooterRender,但是 menuFooterRender 和我的希望还不太一样。
我理解 menuFooterRender 是位于左侧栏的底部,和菜单是分离的。而我希望增加自定义区域的位置是紧接着菜单的下部。
不知道这样描述是否清楚。期待您的建议。
T
On Jun 11, 2024, at 14:42, 沐清 ***@***.***> wrote:
你这个需求应该自定义menuFooterRender
—
Reply to this email directly, view it on GitHub<#8483 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/AA5NE533PQXDMAMLGSR6BFTZG2L5HAVCNFSM6AAAAABJAWI3VGVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDCNJZHEYTMNJQGI>.
You are receiving this because you authored the thread.Message ID: ***@***.***>
我知道了,你应该用menuContentRender
menuContentRender={(props, defaultDom) =><div>{defaultDom}<div>自定义内容</div></ div>}
类似上面这样
太好了。我会试一下您说的方案,非常感谢回复。
On Jun 12, 2024, at 08:54, 沐清 ***@***.***> wrote:
我知道了,你应该用menuContentRender
menuContentRender={(props, defaultDom) =><div>{defaultDom}<div>自定义内容</div></ div>}
类似上面这样
—
Reply to this email directly, view it on GitHub<#8483 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/AA5NE55IVM5SOBRJ4AO7XVLZG6L37AVCNFSM6AAAAABJAWI3VGVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDCNRRHA3DCNRQGA>.
You are receiving this because you authored the thread.Message ID: ***@***.***>