加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

react ant-design 刷新页面菜单选中项未高亮

发布时间:2020-12-15 20:23:36 所属栏目:百科 来源:网络整理
导读:左侧菜单刷新无法高亮用?withRouter,设置selectedKeys属性 ? ? import { Link,Route,Switch,Redirect,HashRouter,withRouter } from ‘react-router-dom‘ ;const LeftSider = withRouter(({ history }) = { return ( Sider Menu mode ="inline" defaultSel

左侧菜单刷新无法高亮用?withRouter,设置selectedKeys属性

? ?

import { Link,Route,Switch,Redirect,HashRouter,withRouter } from ‘react-router-dom‘;

const LeftSider = withRouter(({ history }) => {
  return (
    <Sider >
      <Menu
        mode="inline"
        defaultSelectedKeys={[‘/new-pro‘]}
        selectedKeys={[history.location.pathname]}
        theme="dark"
      >
        <Menu.Item key="/new-pro">
          <Link to="/new-pro" replace />
          新建项目
        </Menu.Item>
        <Menu.Item key="/pro-list">
          <Link to="/pro-list" replace />
          项目列表
        </Menu.Item>
      </Menu>
    </Sider>

  );
})

class App extends Component {
  render() {
    return (
      <HashRouter>
        <Layout style={{ minHeight: ‘100vh‘ }}>
          <LeftSider />
          <Layout>
            <Header style={{ background: ‘#fff‘,padding: 0 }}>
            </Header>
            <Content style={{ margin: ‘0 16px‘ }}>
              <div
                style={{
                  margin: ‘24px 16px‘,padding: 0,background: ‘#fff‘,minHeight: 850,}}   >
                <main>
                  <Switch>
                    <Route path="/new-pro" component={History} />
                    <Route path="/pro-list" component={HeaderBar} />
                    <Redirect to="/new-pro" />
                  </Switch>
                </main>
              </div>
            </Content>
          </Layout>
        </Layout>
      </HashRouter>
    );
  }
}
export default App;

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读