【Ant Design Pro 五】箱套路由在菜单栏显示返回上一页

a_靖

于 2020-02-20 15:43:10 发布

阅读量4.9k

点赞数

本文链接：https://blog.csdn.net/qq_35713752/article/details/104411877

版权

Ant Design Pro 教程专栏同时被 3 个专栏收录

40 篇文章 ¥49.90 ¥99.00

订阅专栏

Web前端

406 篇文章

订阅专栏

react

48 篇文章

订阅专栏

本文介绍了如何在Ant Design Pro的菜单栏中实现返回上级页面的功能。在从菜单进入子页面后，为了方便用户操作，通常需要在子页面提供返回上级页面的选项。文章通过代码示例详细展示了这一功能的实现过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

效果图：

场景：从菜单栏进入子页面，但是子页面默认不在路由显示，完成操作后需要返回上级页面。所以要在菜单栏中加返回的功能。

实现代码：

import React from 'react';
import { Button, Card, Icon } from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import router from 'umi/router';

class StoreGrouping extends React.Component {
    render() {

        return (
            <PageHeaderWrapper title='添加分组' menuHeaderRender={false} content={
                <a onClick={() => router.goBack()}>
                    <Icon type="left" />
                    返回
                </a>
            }><div>123</div></PageHeaderWrapper>
        )
    }
}
export default StoreGrouping;