刷新浏览器后让antd导航菜单Menu还有上一次的高亮记录

537 阅读1分钟

函数里面写

  // console.log(props.location.pathname)缓存得到地址栏给到selectKeys
  const selectKeys = [props.location.pathname]
  const openKeys = ["/"+props.location.pathname.split("/")[1]]
  // console.log(openKeys);把下拉二级导航地址栏的后面取除掉后给到openKeys

return里

<Menu
            theme="dark"
            mode="inline"
            items={
              [
                {
                  key: '/home',
                  icon: <AppstoreOutlined />,
                  label: '首页',
                  onClick: () => { history.push('/home'); }
                },
                {
                  key: '/financial',
                  icon:<PropertySafetyOutlined />,
                  label: '财务',
                  onClick: () => { history.push('/financial');  }

                },
                {
                  key: '/sales',
                  icon: <LineChartOutlined />,
                  label: '销售',
                  onClick: () => { history.push('/sales'); }

                },
                {
                  key: '/afterSales',
                  icon: <ClusterOutlined />,
                  label: '售后',
                  onClick: () => { history.push('/afterSales'); }

                },
                {
                  key: '/logistics',
                  icon: <CarOutlined />,
                  label: '物流',
                  onClick: () => { history.push('/logistics'); }

                },
                {
                  key: '/warehouse',
                  icon: <BankOutlined />,
                  label: '仓库',
                  onClick: () => { history.push('/warehouse'); }
                },
                {
                  key: '/manage',
                  icon:<SettingOutlined />,
                  label: '权限管理',
                  children: [
                    {
                      key: '/manage/1',
                      icon:<SettingOutlined />,
                      label: '权限管理',
                      onClick: () => { history.push('/manage/1'); }
                    },
                  ],
                },
              ]
            }
            //把openKeys给到defaultOpenKeys让他显示下拉菜单
            defaultOpenKeys={openKeys}
            //把selectKeys给到defaultSelectedKeys让他高亮
            //defaultSelectedKeys={selectKeys}
            //换成这个selectedKeys,地址栏输入会受控到对应的组件高亮
            selectedKeys={selectKeys}
           />

这样就可以实现刷新浏览器,上一次的记录还是那个位置