zoukankan      html  css  js  c++  java
  • antd 刷新页面及后退时菜单栏高亮问题

    左侧菜单刷新无法高亮用 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;
  • 相关阅读:
    强化学习读书笔记
    强化学习读书笔记
    知天命
    强化学习读书笔记
    强化学习读书笔记
    强化学习读书笔记
    强化学习读书笔记
    强化学习读书笔记
    强化学习读书笔记
    强化学习读书笔记
  • 原文地址:https://www.cnblogs.com/zxiaoyu/p/9627848.html
Copyright © 2011-2022 走看看