antd design pro菜单打开http链接

20 篇文章 0 订阅

pro的动态菜单之前有写过,这里就不重复了。现在遇到的问题是点击菜单的某一个跳转的是http链接,不是路由,将http放在菜单时进行跳转时会跳转到当前IP地址后面加/+http的地址,相当于http前面有一条斜杆。

翻阅pro的githup查issues看别人有没有遇到类似的问题,发现了两个类似的:
如何配置不展示在菜单中的router:https://github.com/ant-design/ant-design-pro/issues/227

menu里配置外链,生成path错误:https://github.com/ant-design/ant-design-pro/issues/2613

具体的解决办法,chenshuai2144(蚂蚁金服前端)给出了官方回答,大家可以查看以下链接;
增加了对了url 的支持。https://类型的不再增加 / 前缀:https://github.com/umijs/umi/pull/1293/files/291471591998df00977c376c77dac3f291f41841…15f436d154d55085103552e2afc11d2ab4844588

不过我自己没有用上面的办法,上面都是我查资料查到的,你们可以自行看着用;我本人看了这些方法后,有了启发,所以我是将path地址改成http的地址,然后在src/layouts/BasicLayout.jsx将ProLayout修改了下,

 <ProLayout
    onCollapse={handleMenuCollapse}
    menuItemRender={(menuItemProps, defaultDom) => {
        if (menuItemProps.isUrl || menuItemProps.children) {
            return defaultDom;
        }
        return (
            menuItemProps.path.indexOf('/test判断哪个需要跳转') !== -1 ?
                <a onClick={handleMenuCollapse} href={你的http地址}>
                    {defaultDom}
                </a> :
                <Link onClick={handleMenuCollapse} to={menuItemProps.path}>
                    {defaultDom}
                </Link>
        );
    }}

这样子就不会给链接前面加/作为路由跳转,而是直接跳转的http链接。

如果对你有帮助的话,可以给我点个赞,谢谢!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值